在属性上使用Array.slice（）时，Angular2模板未更新

编辑：在我做了一些改进和重构之后，视图不会再次更新。我在下面编辑了我的更改

我真的不知道，如何把我的问题放在一个标题里，所以这里有一个较长的版本

我有一个组件，在init上它以数组的形式获取数据并存储它。在模板方面，我通过*ngFor迭代这个数组。现在，当我从数组中切片一个元素或追加一个元素时，我如何“告诉”*ngFor再次迭代并显示更改

private array: String;  

ngOnInit(){
    this.array = ["lel", "soos", "meme"];
}

updateValues(){
    this.array.splice(1, 1);
}


<div *ngFor="let item of array">
    ...
</div>

模板部分：

<div class="card" *ngFor="let post of project.posts | orderBy: 'id':false">
    <div class="card-block">
                    <div class="row">
                        <div class="col-sm-10">
                            <h4 class="card-title">{{ post.headline }}</h4>
                        </div>
                        <div class="col-sm-1 ml-3">
                            <div *ngIf="adminMode" class="btn-group-sm " role="group">
                                <button id="adminGroupDrop" type="button" class="btn btn-secondary dropdown-toggle"
                                        data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Edit
                                </button>
                                <div class="dropdown-menu" aria-labelledby="adminGroupDrop">
                                    <button type="button" class="dropdown-item">Bearbeiten</button>
                                    <button type="button" (click)="confirmPostDeletion(post)" class="dropdown-item">Löschen</button>
                                </div>
                            </div>
                        </div>
                    </div>
                    <p class="card-text">{{ post.content }}</p>
                </div>
</div>

{{post.headline}
编辑
贝尔贝滕
洛申
{{post.content}

您的示例中的问题是您实际上没有修改数组（array.slice不会更改数组的内容-它只返回数组的一部分）

如果您只是正确地改变（修改）组件上定义的变量的值，它应该会自动发现这个变化。尝试以下方法：

updateValues(){
    this.array.splice(1, 1);
}

---

（

splice

与

slice

相比，slice确实会更改它所操作的数组）

您是否可以将其余代码发布到调用了

updateValue（）

的地方，需要确保

updateValue（）

获取调用

另外，在

updateValues（）

中，您可以添加一个标志以确保数组得到更新，并将

*ngIf

放入

例如： 私有数组：字符串
更新：布尔

ngOnInit(){
    this.array = ["lel", "soos", "meme"];
    this.isUpdated = false;
}

updateValues(){
    this.array.splice(1, 1);
    this.isUpdated = true;
}


<div *ngIf="isUpdated" *ngFor="let item of array">
    ...
</div>

ngOnInit（）{
this.array=[“lel”、“soos”、“meme”]；
this.isUpdated=false；
}
updateValue（）{
这个.数组.拼接（1,1）；
this.isUpdated=true；
}
...

拼接方法不会修改阵列

此方法返回修改后的数组。 例如：

data = arrayValue.splice(1,2);

---

嘿我实际上是在拼接阵列。我只是在我的例子中弄错了。仍然不起作用…我只是试着复制它，它应该会起作用。你能提供一个坏掉的工作代码吗？它似乎在工作，有什么问题吗？当你执行

this.project.posts.splice（this.project.posts.indexOf（post），1）时，你能不能
console.log（this.project.posts）

以确保

posts

数组处于我们期望的状态？（即，该对象确实已移除）

data = arrayValue.splice(1,2);