Angular2本地模板变量与同名组件属性

全部：

我对Angular2非常陌生，当我尝试用户输入时，我使用了一个模板局部变量，如：

@Component({
  selector: 'my-app',
  template: `
    <input #userinput (input)="0" />
    <div>{{userinput.value}}</div>
  `
})
export class AppComponent {
  userinput = {value:"inside component"};
}

@组件({
选择器：“我的应用程序”，
模板：`
{{userinput.value}
`
})
导出类AppComponent{
userinput={value:“内部组件”}；
}

我想知道是否有办法在组件内部使用userinput属性，而不是使用input元素中的本地模板变量？或者我必须使用不同的名称

---

谢谢

您可以使用

@ViewChild（）

装饰器引用本地模板的变量：

export class AppComponent {
  @ViewChild('userinput') userinput;
}

---

请注意，在访问

userinput

值之前，您需要等待一段时间，它在

AfterViewInit（）中提供。

hook:。

谢谢，所以这意味着组件属性和本地模板变量现在都引用相同的东西（输入DOM）？@Kuan是的，

Input

只是包装为。您可以使用userinput.nativeElement获得实际的DOM元素。谢谢，明白了。但是，如果我确实需要两个单独的变量（一个用于本地模板变量，另一个用于组件属性），是否有一种方法可以满足我的要求（即使用componnet属性中的值），只需在组件

@ViewChild（'userinput'）中使用不同的变量名即可确定。我会的。问这个只是出于好奇的原因。