Question

我的JSON看起来像这样：

[
 {
   "firstName": "tom",
   "lastName": "null",
   "phone": "null",
   "status": "Active",
 },
 {
   "firstName": "Bob",
   "lastName": "null",
   "phone": "null",
   "status": "Inactive",
 }
]

我正在显示JSON对象的第二个属性（即lastName），如下所示：

  <div class="form-group" >
      <label>Last Name</label>
      <input  class="form-control" [(ngModel)]="customer.lastName">
  </div>

由于其值为null，因此显示为null，这里我需要这样写条件：

如果输入中的properties（lastName，phone ...）值为null，则它不应显示任何内容，但输入应对用户可见。

Answer 1

您可以使用ng模型中的条件（三元）运算符来实现此目标下面。

<div class="form-group" >
      <label>Last Name</label>
      <input  class="form-control" [(ngModel)]="customer.lastName === 'null' ? '' : customer.lastName">
  </div>

Answer 2

首先，您没有将null分配给属性，而是将字符串分配为值"null"。

很难理解您的问题。听起来，您想要实现的目标是这样的。

在Controller类中实现接口AfterViewInit。

 @ViewChild('yourForm') yourForm: NgForm;

const jsonArray = [
 {
   "firstName": "tom",
   "lastName": null,
   "phone": null,
   "status": "Active",
 },
 {
   "firstName": "Bob",
   "lastName": null,
   "phone": null,
   "status": "Inactive",
 }
];

    ngAfterViewInit() {
    for (let key in this.yourForm.controls) {
              if (this.yourForm.controls[key] && this.jsonArray[0][key]) {
                this.yourForm.controls[key].setValue(this.jsonArray[0][key]);
              }
            }
    }

在您的模板中：

<form #yourForm="ngForm" (ngSubmit)='submit(yourForm)'>
...
 <input #lastName name="lastName" type="text" ngModel>
 </input>
...
</form>

如果属性值为null，则在输入字段中显示空值

2 个答案: