我无法弄清楚如何为组件提供对其视图的引用,以便在显示表单时执行诸如关注输入元素之类的操作.我不能出现注入Element
或ng.core.ViewRef
或ng.core.View
到构造.如何访问视图?
在Angular 1中,我会用$ link做到这一点.
您正在寻找的可能是ElementRef
它的nativeElement
领域,但您应该避免以这种方式访问DOM.我认为更好的方法是添加模板变量和访问它
@ViewChild('inp') input
.在ngAfterViewInit
input
引用中输入元素.
另请参见angular 2/typescript:获取模板中的元素
我还要警告Angular中的直接DOM访问,但这里有一个如何做的例子:
import {Component, ElementRef, Inject, OnInit} from '@angular/core'; declare var jQuery:any; @Component({ selector: 'jquery-integration', templateUrl: './components/jquery-integration/jquery-integration.html' }) export class JqueryIntegration implements OnInit { constructor(private elementRef: ElementRef) { } ngOnInit() { jQuery(this.elementRef.nativeElement).find('.moving-box').draggable({containment:'#draggable-parent'}); } }
关键的想法是注入elementRef.然后,您可以将其视为常规DOM元素.在我的示例中,我使用的是jquery,但您也可以使用标准DOM访问.
更多信息:http://www.syntaxsuccess.com/viewarticle/using-jquery-with-angular-2.0