Question

以角度2的形式填充了具有类属性的ngModel。但我有2个额外的属性，例如当用户填写电子邮件输入时我想要两个属性获取此值（电子邮件和用户名），当填写密码输入时，两个属性获取此值（密码和confirmPassword）。它的语法是什么？我尝试了这个，但它发送错误：

<input [(ngModel)]="createuser.pasword;createuser.confirmPassword" name="password" type="password" minlength="6" required>

createuser是CreateUser的对象：

export  class CreateUser {
mail: string;
UserName: string;
password: string;
confirmPassword: string;}

非常感谢你以简单的方式提供帮助。

Answer 1

我不认为Angular支持将ngModel绑定到两个属性。但是，将ngModel和(event)组合在一起可以完成您的任务：

通过[(ngModel)]绑定邮件属性。
然后使用input事件侦听将用户名绑定到mail。

component.html

<input type="text" [(ngModel)]="mail" (input)="setUserName($event)">
<p>
  mail {{mail}}
</p>

<p>
  username {{UserName}}
</p>

component.ts

export class CreateUser{
  mail: string;
  UserName: string;
  password: string;
  confirmPassword: string;

  constructor() { }

  setUserName(event) {
    this.UserName = event.target.value;
    // or 
    // this.UserName = this.mail;
  }
}

虽然这种方法运作正常，但我并不了解使用它的必要性。正如它在上面的评论中所说，你可以将一个字段留空，然后在后端正确处理它。

Answer 2

经过多次思考后，我发现我可以在ts的组成部分中这样做：

this.createuser.mail=this.createuser.UserName;
this.createuser.confirmPassword=this.createuser.pasword;

如何使用ngModel的两个属性？

2 个答案: