设置变量时Angular ngModel不更新

Question

我正在使用Angular 4和Typescript，我的模板中有一个<select>的表格：

<tr *ngFor="let task of tasksDetails">
    <td>{{task.name}}</td>
    <td>
        <select class="form-control" [(ngModel)]="task.uiMetadata.worker">
            <option value="">Select worker</option>
            <option *ngFor="let worker of workers" [value]="worker.resource.id">{{worker.resource.name}}</option>
        </select>
    </td>
</tr>

在另一个组件中，我可以添加/删除到employees列表，并将其输出到此组件所订阅的Subject：

this.workerRemoved.subscribe(worker => {
    _each(this.tasksDetails, taskTemplate => {
        if (taskTemplate.uiMetadata.worker === member.resourceId) {
            taskTemplate.uiMetadata.worker = '';
        }
    });
});

问题在于，当订阅​​更新变量中的字段时，ngModel不会接收更改并将其反映在UI中。

因此，我们最终得出ng-reflect-model显示为“11”的情况，worker变量为空字符串，并且select显示为空白，因为“11”选项已被删除。

如何让Angular保持模型与我在订阅中所做的更改保持同步？我尝试将其打包在NgZone.run()中并调用ChangeDetectorRef.detectChanges()，但都不会更新ng-reflect-model值。

Here is a Plunker reproducing the error

Answer 1

我找到了解决方案，感谢yurzui指出我正确的方向：

if (taskTemplate.uiMetadata.worker === member.resourceId) {

更改为

if (+taskTemplate.uiMetadata.worker === +member.resourceId) {

因此严格的平等就是比较数字。表单输入将值转换为字符串。有时容易的人可以得到你。