Question

在我的HTML中，我重复绑定一个项目：

<ul *ngFor="let item in items">
    <li>{{ item.id }}</li>
</ul>

这很好。但是现在该值正在API调用中更改，就像这样：

doApiCall(){
    let value = this.items.find( x => x.id = '123');
    this.service.doIt().subscribe(
        (res: HttpResponse<myModel>) => {
            // response === { id = 456' }
            return value = res.body;
        }
    )
}

现在数组中的项目已更改，但视图未更改。但是有趣的是，如果我在设置后立即手动更改let value，就像这样：

let value = this.items.find( x => x.id = '123');
value.id = '345'

然后进行更新。所以我不知道我在API调用中是否做错了什么。

Answer 1

似乎您需要刷新JavaScript的工作方式。您正在返回value = res.body值。那是什么那根本行不通。

似乎items是引用类型的对象数组。当您尝试执行value = res.body时，您根本没有更改items数组中的任何内容。您只是重新分配了存储在value变量中的引用，但使用Array.find函数找到的项目保持不变。也许您应该尝试做类似的事情

doApiCall() {
    let value = this.items.find(x => x.id = '123');
    this.service.doIt().subscribe(
        (res: HttpResponse < any > ) => {
            value.id = res.body.id;
            value.someproperty = res.body.property;
        }
    )
}

但是我不知道您的HttpResponse.body模型。因此，您应该通过服务而不是Promise<T>来响应HttpResponse<any>。您正在使用TypeScript，所以请使其有用！

Angular 6-绑定项目在数据更改后未更新

1 个答案: