所以我有一个来自服务器的复杂日期模型来提供我的 Angular2 组件。下面显示了该组件模板的一小部分:
<div>
<span>{{Person.Address.City}}</span>
<input type="text" [(ngModel)]="Person.Address.City" />
</div>
Address
可能是 null
或 undefined
,具体取决于从服务器返回的数据。我知道 elvis 运算符将使我免于一个错误:
<span>{{Person?.Address?.City}}</span>
但不幸的是,它不会为 [(ngModel)]="Person.Address.City"
保存我,因为没有为此定义 elvis。如果你做类似 [(ngModel)]="Person?.Address?.City"
的事情,你会得到一个解析器错误,如果你不这样做,你会得到 null
异常。
这里有两个最简单的数据变体,尽管还可以有更多:
{
Name:'sam',
LastName: 'jones',
Address: {
Street: '123 somewhere',
City: 'some land'
State: 'SL'
}
}
或者...
{
Name:'sam',
LastName: 'jones'
}
由于表示和业务逻辑的分离,处理这些场景的责任应该在 Angular2 而不是提供数据的服务器上,我将如何处理这些场景?
最佳答案
事实证明,您要么维护 3 个模型,一个用于前端 (Angular2),一个用于中间层(ASP.NET、JAVA 等),另一个用于数据模型。或者您可以像我一样确保您的中间层模型不会有空的复杂对象。这意味着在你的模型中初始化复杂的属性并摆脱 2 个模型。
另请注意,如果您没有或不能修改您的中间层模型,那么您唯一的选择是为您的前端 (Angular2) 创建一个兼容模型,并在数据返回后根据需要合并来自 API、服务等。
关于javascript - Angular2,子属性和 elvis 运算符,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36849689/