Javascript 通过将数据存储在类变量中而间接更改UI不起作用

如果我想在我的UI中进行任何更改，那么我直接传递数据，如下所示

在HTML模板中

这也会反映在用户界面中，效果很好！ 但是，当我试图间接地这样做时，这种情况不会发生：

在HTML模板中

当我在类变量中保存数据，然后在变量中进行更改时，它不会反映在UI中

疑问：

如何在类变量中保存帖子的引用？ 这是间接进行更改的正确方法还是我在html中传递了数据？

---

任何帮助都很好，谢谢

似乎只有在调用列表项上的“deleteCategory”方法时才保存已删除的帖子。因此，在您的设置中，仅当您第一次按下其中一个列表项上的“编辑”按钮时，更改才会反映出来

由于finallyDeleteCategory不在循环上下文中，您不能只传递post的引用并更改其名称，因为它不存在

this.savedPost.name=已删除；不起作用，因为正在循环的元素是post数组的一部分。您可以做的是保存post索引i，而不是post对象和方法

(click)="editCategory(i)"

deleteCategory(loopindex){
 this.index=loopindex
}

最终删除类别从数组中检索帖子，然后直接在那里进行更改

finallyDeleteCategory(){
  posts[this.index].name="deleted";
}

---

看起来您正在更改此.savedPost中的状态，但您正在迭代post…这可能是原因。当它工作正常时，post也在迭代@Farasi78finallyDeleteCategorypost它需要一个参数，但您的函数finallyDeleteCategory不同。。是吗？@Niladri抱歉在我的问题中做了更改。它不在任何迭代中。它应该是finallyDeleteCategory，因为它只是我场景的一个模型。不确定你的意思。。。您的意思是：this.savedPost=post。this.savedPost.name=已删除，我认为这不会改变帖子。您需要将post.name=deleted设置为deleted，才能显示为deleted。很抱歉，这在UIsorry中没有改变，当我遵循您的解决方案时，我的代码中有一个输入错误。

 <li *ngFor="let post of posts;let i = index;">
{{i+1}}) {{post.name}}
<button (click)="deleteCategory(post); modal1.show();" class="btn btn-danger btn-sm">Edit</button>
</li>
<div #modal1="bs-modal">
<button (click)="finallyDeleteCategory(); modal1.show();" class="btn btn-danger btn-sm">Edit</button> //making changes through this button
</div>

deleteCategory(post){
 this.savedPost=post;
}
finallyDeleteCategory(){
 this.savedPost.name="deleted"; //this Doesn't work
}

(click)="editCategory(i)"

deleteCategory(loopindex){
 this.index=loopindex
}

finallyDeleteCategory(){
  posts[this.index].name="deleted";
}