Question

我的应用程序包含可以为空的数据字段。例如，两个日期字段PublishOn＆amp;到期。它们都可以为null或具有有效日期。

在客户端，我有一个具有匹配字段的对象，这些字段将填充来自Web API的数据。但是当我绑定数据时如下

<input class="form-control" type="text" name="Title" [(ngModel)] = "entity.PublishOn">

当PublishOn属性具有值时，它可以正常工作。如果它为null则失败。我知道在获取数据后我可以将任何空值转换为空字符串或者什么，但是想知道为什么Angular在这种情况下不灵活？我的意思是，如果它有一个绑定的值，如果它是空的/ null，它只是保持原样。

处理这种情况的Angular方法是什么？

更新 - 1

我跟着ValueAccessor样本; here和here

但是每次运行时，都会给我一个例外“多个自定义值访问器匹配带有未指定名称属性的表单控件”我有一个简单的要求。那是在控制它的绑定值之前应该检查null。如果它为null应该返回一个空字符串！

Answer 1

如果您使用的是角度版本，则可以使用ngIf语句处理该场景。

<ng-template [ngIf]= "ngModel" >
 <input class="form-control" type="text" name="Title" [(ngModel)] = "entity.PublishOn">
</ng-template>

 <ng-template [ngIf]= "!ngModel" >
 <input class="form-control" type="text" name="Title" >
</ng-template>

Answer 2

现在使用Angular 6可以正常工作。如果未定义变量属性，它将通过创建属性自动绑定输入的值。

直到你升级到Angular 6，你可以使用：

<input class="form-control" type="text" name="Title" [(ngModel)]"entity?.PublishOn">

Answer 3

如果entity是定义的类设置entity.publishOn，则默认值为''是一件简单的事情。

如果entity本身有null的可能性，那么最好通过控制器中的变量暴露相同的get和set方法，例如

 private _entity:Entity; // this is the declaration of the variable 
    ...
    ...
    constructor(){
       this._entity = new Entity();
    }
    ...
    ...
    get entity():Entity{
      return this._entity;
    }
    set entity(value:Entity):void{
      if(value){
    this._entity =value;
      }else{
       this._entity = new Entity() // cases when we want to reset the value
    }
   }

使用[（ngModel）]与数据库中的可空类型

3 个答案: