在第三个属性级别中的Angular2 ngModel绑定未定义

Question

我的表单上发生了一件奇怪的事情，或者我的行为不正确，请让我通过展示我的代码向您解释。

我定义我的组件

form = {}; 

有与数据每行一个按钮内部表单对象，当你点击它会打开一个模式寡妇，也通过该项目作为参数。

<a class="btn btn-warning" (click)="open(item)"><i class="glyphicon glyphicon-pencil"></i></a> 

这是火灾和打开一个模式窗口，而且分配的项目对象以形成上述目的的方法：通过打印出来这样

open = (item: any) => { 
    this.inventoryEditModal.open(); //Opens a modal window 

    this.form = item; // the assignment 
} 

Item对象是可在图：

{{ form | json }} // i can see all item properties 

模态窗口包含一个表单，用户将编辑的项目，所以基本上输入表单字段应该得到装满物品的属性值，但由于某种原因，第三水平是不确定的，我不明白为什么，让我告诉你的第二个层次的截图

<input type="text" class="form-control" [(ngModel)]="form.alarmSystem" name="wireless"> 

第三层次得到未定义：

<input type="text" class="form-control" [(ngModel)]="form.alarmSystem.wireless" name="wireless"> 

此问题仅在第三级“object.object.property”中发生。我只显示一个输入字段，但表单中包含8个以上的字段，它们都有相同的问题。

不知道我在这里错过了什么，但从逻辑上说它应该工作。你有没有看到这个问题在这里或那里发生或经历过你自己？

预先感谢您。

Answer 1

我不确定它是否有助于您的情况，但我处于非常相似的情况。

什么帮助我使用“安全导航运营商”。

我认为你需要做的只是添加？后形式：

<input type="text" class="form-control" [(ngModel)]="form?.alarmSystem.wireless" name="wireless"> 

该文档可以在这里找到：https://angular.io/docs/ts/latest/guide/template-syntax.html#!#safe-navigation-operator