使用angular 7单击“添加”按钮时如何在表中添加行

使用angular 7单击“添加”按钮时如何在表中添加行,angular,Angular,单击“添加”按钮时,无法添加行。如何在表中添加行 我的HTML文件看起来像: <div> <div> <table class="table table-bordered table-striped mb-0 mt-3"> <thead> <tr> <th>Name</th> <th>Type</th> <th>Required&

单击“添加”按钮时,无法添加行。如何在表中添加行

我的HTML文件看起来像:

<div>
<div>
<table class="table table-bordered table-striped mb-0 mt-3">
  <thead>
    <tr>
      <th>Name</th>
      <th>Type</th>
      <th>Required</th>
      <th></th>
    </tr>
  </thead>
  <tbody>
      <tr *ngFor="let field of fieldArray; let i = index">
      <td>
        <input type="text" [(ngModel)]="field.domainName"> 
</td>
      <td>
        <div class="optionDropdown" 
[(ngModel)]="field.domainSelect">
        <nb-select class="" placeholder="All" 
[(selected)]="selectedItem">
          <nb-option value="">Option empty</nb-option>
          <nb-option value="0">Integer</nb-option>
          <nb-option value="1">Float</nb-option>
          <nb-option value="2">String</nb-option>
          <nb-option value="3">Character</nb-option>
          <nb-option value="4">Boolean</nb-option>
        </nb-select>
      </div></td>
      <td>
        <div [(ngModel)]="field.domainRequired">
            <nb-checkbox (checkedChange)="toggle($event)"></nb- 
checkbox>
        </div>            
      </td>
      <td (click)="newRow()">
        <div [(ngModel)]="field.domainIcon">
            <i class="plusIcon nb-plus"></i>
        </div>            
      </td>
    </tr>
  </tbody>
</table>
</div>
</div>
export class DomainStructuredDataComponent implements OnInit {

  constructor() { }
  checked = false;
  domain: string;
  selectedItem: any;
  domainSelect: any;
  domainIcon: boolean;
  fieldArray: any = [];
  newAttribute: any = {};
  ngOnInit() {
  }
  toggle(checked: boolean) {
    this.checked = checked;
  }
  newRow() {
    this.fieldArray.push('');
  }
}

我在上面提到了我的代码。让我知道如何修复它。

您需要推送一个对象,而不是像这样的字符串

newRow() {
    this.fieldArray.push({
       domainName:'',
       domainSelect:'',
       domainRequired:'',
       domainIcon:''
    });
}

注意:-您可以使用默认值,而不是在上面的对象中

还可以设置fieldArray:any=[];根据他的ngFor向公众添加域名图标,指出我的错误。更改数组推送后,tbody不显示。@vishnupriya这是因为数组中没有任何项目,可以在行外添加按钮,将其放在其他位置