Access a DOM element in Aurelia

后端 未结 5 1058
独厮守ぢ
独厮守ぢ 2021-01-07 17:09

How would you go about accessing a DOM element in Aurelia? This is a broad and general question, but I have a feeling there are one or two preferred ways to do this. I have

相关标签:
5条回答
  • 2021-01-07 17:43

    Just as another point I came across when trying to use this for myself, the ref variable isn't available during construction, and this isn't clear in the documentation. You can begin to reference the element as mentioned above (http://aurelia.io/hub.html#/doc/article/aurelia/binding/latest/binding-basics/5) anytime during or after the attached method is called.

    0 讨论(0)
  • 2021-01-07 17:46

    Use binding system's ref capability. See the docs http://aurelia.io/docs/binding/basics#referencing-elements

    0 讨论(0)
  • 2021-01-07 17:51

    As Rob suggested, use ref. For your example:

    view

    <form ref="myForm"></form>
    

    viewModel

    class ViewModel { 
    
        canDeactivate() {
            var form = this.myForm;
            // do stuffs
        }
    }
    

    For more information on the ref attribute, see here: http://aurelia.io/docs/binding/basics#function-references

    0 讨论(0)
  • 2021-01-07 17:58

    Another option; if your view-model is exposed as a @customElement, its DOM element can be injected in the constructor:

    @customElement
    @inject(Element)
    export class MyCustomElement {
        constrctor(element) {
            logger.info(element) // ==> <my-custom-element></my-custom-element>
        }
    }
    
    0 讨论(0)
  • 2021-01-07 18:00

    Typescript version

    @transient()
    @autoinject
    export class ViewModel { 
        myForm: any;
        canDeactivate() {
            var form = this.myForm;
            // do stuffs
        }
    }
    
    0 讨论(0)
提交回复
热议问题