角2组分属性遮蔽

我已经宣布一个属性在角2 Foobar组件调用foobar：角2组分属性遮蔽

import { Component, OnInit } from '@angular/core'; 

@Component({ 
    selector: 'app-foobar', 
    templateUrl: './foobar.component.html', 
    styleUrls: ['./foobar.component.css'] 
}) 
export class FoobarComponent implements OnInit { 

    foobar= 'test'; 

    ngOnInit() { 
    } 
}

然后在foobar.component.html文件I输出属性是这样的：

<div> 
    <br> 
    {{foobar}} 
</div>

并输出字test，但是，一旦我添加了ID为foobar的元素：

<div> 
    <br> 
    {{foobar}} 
    <br> 
    <input type="text" #foobar> 
</div>

我不再能够从组件获得价值，并且它输出[object HTMLInputElement]，因为它被输入字段ID遮蔽。

如何在不更改组件属性名称和输入字段ID的情况下从组件获取值？

来源

2017-06-22 Benas

组件没有变量，它们具有属性。 – 2017-06-22 12:15:56

@torazaburo谢谢，我纠正了它。 – Benas

你可以试试这个

<div> 
    <br> 
    {{ this['foobar'] }} 
    <br> 
    <input type="text" #foobar> 
</div>

，但它不记录，并在将来的版本可能会破坏

来源

2017-06-22 11:30:36 yurzui

尝试用双向数据绑定：

<div> 
    <br /> 
    {{foobar}} 
    <br /> 
    <input type="text" [(ngModel)]="foobar"> 
</div>`

要完成你所需要的模块：@ angular /在您的package.json中形成，并且不要忘记将其导入到您的应用程序模块中：

import {FormsModule} from "@angular/forms"; 

@NgModule({ 
    declarations: [ ... ], 
    imports: [ 
     FormsModule, 
     ... 
    ] 
    ... 
}) 
export class AppModule{ ... }

来源

2017-06-22 11:33:34

角2组分属性遮蔽

回答

相关问题