Angular 如何将ngModel应用于使用角度

嘿，伙计们，我是Angular方面的新手，据我所知，ngModel是用于双向绑定的，对吗？所以如果我有两个输入框，我可以将一个绑定到另一个，所以当我在其中一个框上键入内容时，第一个框会被更新吗

        <form >
    <div>
    <input type="text" [(ngModel)]="test" id="test1" >
    <input type="text" id="test" ">
    </div>
    </form>

你当然可以。只需在输入中使用相同的
ngModel
。
就像这样：

<input type="text" [(ngModel)]="test" id="test1" >
<input type="text" [(ngModel)]="test" id="test2" >

当然可以。只需在输入中使用相同的
ngModel
。
就像这样：

<input type="text" [(ngModel)]="test" id="test1" >
<input type="text" [(ngModel)]="test" id="test2" >

尽管Tony Marko已经回答了您的问题。我想补充几个细节。首先，ngModel可以在不同的情况下使用。比如说

第一。在输入上初始化FormControl实例

// Creates FormControl with a name firstName and template ref firstName
// So FormControl props can be used in your template
// for example *ngIf="firstName.valid"
<input ngModel name="firstName" #firstName="ngModel">

//使用名称firstName和模板ref firstName创建FormControl
//因此，可以在模板中使用FormControl道具
//例如*ngIf=“firstName.valid”

第二。单向值绑定

// Value of the input changes as soon as IMMUTABLE component property changes
<input [ngModel]="firstName" name="firstName">

//当不可变组件属性更改时，输入的值也会更改

三,。双向装订

// The same as before but also changes property on input change
<input [(ngModel)]="firstName" name="firstName">

// Its 100% identical as previous, but event emitter is separated
// Which allows you to do side action onModelChange event
<input [ngModel]="firstName" (ngModelChange)="firstName = $event" name="firstName">

//与前面相同，但在输入更改时也会更改属性

第四。分离式双向装订

// The same as before but also changes property on input change
<input [(ngModel)]="firstName" name="firstName">

// Its 100% identical as previous, but event emitter is separated
// Which allows you to do side action onModelChange event
<input [ngModel]="firstName" (ngModelChange)="firstName = $event" name="firstName">

//它与前面的100%相同，但事件发射器是分开的
//它允许您对ModelChange事件执行附加操作

我希望它能澄清你的答案，尽管托尼·马尔科已经回答了你的问题。我想补充几个细节。首先，ngModel可以在不同的情况下使用。比如说

第一。在输入上初始化FormControl实例

// Creates FormControl with a name firstName and template ref firstName
// So FormControl props can be used in your template
// for example *ngIf="firstName.valid"
<input ngModel name="firstName" #firstName="ngModel">

//使用名称firstName和模板ref firstName创建FormControl
//因此，可以在模板中使用FormControl道具
//例如*ngIf=“firstName.valid”

第二。单向值绑定

// Value of the input changes as soon as IMMUTABLE component property changes
<input [ngModel]="firstName" name="firstName">

//当不可变组件属性更改时，输入的值也会更改

三,。双向装订

// The same as before but also changes property on input change
<input [(ngModel)]="firstName" name="firstName">

// Its 100% identical as previous, but event emitter is separated
// Which allows you to do side action onModelChange event
<input [ngModel]="firstName" (ngModelChange)="firstName = $event" name="firstName">

//与前面相同，但在输入更改时也会更改属性

第四。分离式双向装订

// The same as before but also changes property on input change
<input [(ngModel)]="firstName" name="firstName">

// Its 100% identical as previous, but event emitter is separated
// Which allows you to do side action onModelChange event
<input [ngModel]="firstName" (ngModelChange)="firstName = $event" name="firstName">

//它与前面的100%相同，但事件发射器是分开的
//它允许您对ModelChange事件执行附加操作

我希望它能澄清您的答案
名称属性如何？因为我现在得到了错误-此处无错误如果在表单标记中使用ngModel，则必须在ngModelOptions中设置名称属性或将表单控件定义为“独立”。如果使用ngForm，则所有具有[（ngModel）]=“”的输入字段必须具有具有值的属性名称。name属性如何？因为我现在得到错误-此处无错误如果在表单标记中使用ngModel，则必须在ngModelOptions中设置name属性或将表单控件定义为“standalone”。如果使用ngForm，则所有具有[（ngModel）]=”的输入字段必须具有带值的属性名称。是的，那很好，因为我不太清楚为什么我需要一个身份证和名字，现在我想我得到了很好的答案。你可以删除name属性，Angular会让你知道它丢失了。是的，这非常好，因为我不太清楚为什么我需要一个ID和名称，现在我想我得到了好的结果。您可以删除name属性，Angular会让您知道它丢失了。