我有一个用户列表和用户详细信息组件,类似于教程中带有英雄列表/详细信息的设置,在列表中选择用户应该使其在详细信息组件中可编辑。问题是更改用户会使表单变脏。为了更清楚,这里是精简的代码:
@Component(...)
class UserDetail {
@Input()
User user;
Future onSubmit() async {...}
}
模板如下:
<form (ngSubmit)="onSubmit()" #userEditForm="ngForm">
<h2>{{user.name}}</h2>
<input type="checkbox"
id="is_happy"
[(ngModel)]="user.is_happy"
ngControl="is_happy"
#is_happy="ngForm" />
<div [hidden]="userEditForm.pristine">
<material-button
[disabled]="!userEditForm.valid"
(trigger)="onSubmit()">
Update
</material-button>
</div>
</form>
我想使表单仅在用户与控件交互时才脏,而不是在底层用户从外部更改时。
这样做的正确方法是什么?有没有办法在用户更改时重置表单?我还没有找到任何可以轻松使用来实现这个简单用例的东西。
最佳答案
很好的问题。
这是默认值访问器的一个不幸的副作用。它正在创建一个反馈循环,导致控件在写入时变脏。通知 line当一个值被写入输入时,它会在输入上引发一个“输入”事件。然后被捕获 here .然后导致在控件上调用更改函数,导致它变脏:(
那么你有什么选择:
希望有帮助!
关于angular - Dart Angular 形成原始/脏动态,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46225710/