Question

我正在以角度5工作，我有一些问题。我有两个模型Person，和Employee继承自Person并拥有自己的属性。在我的组件的html文件中，我创建了一个包含一些输入字段的表单：

<input type="texte" name="name" [(ngModel)]="person.name" />
<input type="texte" name="numberPhone" [(ngModel)]="person.numberPhone" />
<button (click)="isEmployee=true" type="button">is employee</button>
<div *ngIf="isEmployee">
<input type="texte" name="salary" [(ngModel)]="employee.salary" />
</div>

问题是如果isEmployee为false，我想使用相同的表单绑定person，如果isEmployee为true，我想使用employee。以下代码不起作用

[(ngMode)]="isEmployee ? person.name : employee.name"
[(ngMode)]="isEmployee ? person.numberPhone : employee.numberPhone "

有没有办法在不重复html代码的情况下执行此操作？

Answer 1

为什么不使用通常绑定的ngModel创建一个模板：

[(ngMode)]="user.name"

并针对您拥有的每种类型的用户在不同的组件之间共享此模板文件（因此只有人员组件才具有模板文件）-因此，在您的情况下，个人使用1个组件，员工使用1个组件。并且可以在其各自的组件中将用户设置为雇员，在雇员组件中将人员设置为人，在个人组件中。

angular 5 ngModel条件绑定

1 个答案: