时间戳

首页 > 解决方案 > 如何创建新部分，单击angular2中的新按钮

angular - 如何创建新部分，单击angular2中的新按钮

问题描述

我有一个包含 3 个字段的部分，当单击新按钮时，我必须得到相同的部分。我没有收到任何错误，所以我没有找到错误的地方

这里的例子

HTML：

     <form *ngFor="let emergency of Emergencies; let i = index">
        <div>
          <label > Name</label>
  <input type="text"   [(ngModel)]="emergency.Name" name="emergency.Name" 
          />
        </div>
        <div>
          <label >Phone</label>
          <input type="text" OnlyNumber="true" [(ngModel)]="emergency.Phone" name="emergency.Phone"
            maxlength="15" />
        </div>
        <div>
          <label >Relations</label>
          <select class="col-lg-6 col-md-6 col-sm-6 col-xs-6"[(ngModel)]="emergency.ship">
            <option >{{ship.Description}}</option>
          </select>
        </div>
      </div>
    </form>

标签： angular

解决方案

如果您可以使用template driven此处的表格，这就是您的答案。

添加用于创建新字段的按钮

<button (click)="addEmergency()">New</button>

现在，addEmergency在组件中添加方法：

addEmergency() {
    var item = {
      "ContactName":"Person3",
      "Phone": "122355",
      "relationship": ""
      }
    this.Emergencies.push(item);
  }

在 html 中：

<div  *ngFor="let Emergency of Emergencies">
  Your inputs go here
</div>

这是我从您的代码中创建的演示

推荐阅读