角4嵌套* ngFor删除父级错误

Question

我在angular 4中嵌套* ngfor有一个问题，我需要做的是删除父ngfor，我尝试将其设置为null并使用delete，但都无法正常工作，所以我有点无法选择。 基本上，如果删除父ngFor角度异常（至少我认为）并抛出错误，会发生什么。

你们可以帮我一下，告诉我做嵌套* ngfor的正确方法，以便可以删除子级，或者现在在angular 4中，它是以某种不同的方式完成的？

我已经创建了这个测试组件

 @Component({ selector: 'test-parent', templateUrl: './test.component.html', }) export class TestComponent { constructor() { console.log("loaded menu"); setTimeout( ()=> { this.data.categories[1] = null; }, 1000); }; data = { categories: [ { name: 'name 1', items: [ { name: 'item 1' }, { name: 'item 2' }, ] }, { name: 'name 2', items: [ { name: 'item 3' } ] } ] } } 

 <div *ngFor="let c of data.categories"> {{c.name}} <div *ngFor="let i of c.items"> {{i.name}} </div> </div> 

这是错误，除了尝试读取null项以外，无法从中读取太多信息，如果我尝试删除比相同错误而不是undefined为null的错误，我是否需要以某种方式告诉数据更改那部分不是魔术还有吗？ 如果我尝试this.data.categories [0] = []或= {}，它可以很好地更新，因为我想将数据传递给服务器，并且因为用户按下了delete，所以我想删除数据：'（不敢相信那样的事情根本不可能吗？

ERROR TypeError: Cannot read property 'items' of null
at Object.View_TestComponent_1.currVal_0 [as updateDirectives] (TestComponent.html:3)
at Object.debugUpdateDirectives [as updateDirectives] (core.es5.js:12613)
at checkAndUpdateView (core.es5.js:12025)
at callViewAction (core.es5.js:12340)
at execEmbeddedViewsAction (core.es5.js:12312)
at checkAndUpdateView (core.es5.js:12026)
at callViewAction (core.es5.js:12340)
at execComponentViewsAction (core.es5.js:12286)
at checkAndUpdateView (core.es5.js:12031)
at callViewAction (core.es5.js:12340)
at execEmbeddedViewsAction (core.es5.js:12312)
at checkAndUpdateView (core.es5.js:12026)
at callViewAction (core.es5.js:12340)
at execComponentViewsAction (core.es5.js:12286)
at checkAndUpdateView (core.es5.js:12031)

Answer 1

要从Array删除项目，应使用Array.splice(index, length) 。

---

使用delete将使该项目undefined ，但仍然存在（Array的一项）。 与设置为null相同。 而对于您的情况，这将导致错误cannot find something of null/undefined