Question

我正在使用ionic 2 angular 2.我想知道如何在html模板中创建一个多嵌套的 formgroup 。

例如：

这是 .ts 文件

中的表单组

<div class="navbar navbar-default navbar-fixed-bottom">
    <div class="container">
      <p class="navbar-text pull-left">© 2014 - Site Built By Mr. M.
           <a href="" >Test Link</a>
      </p>

      <a href="" class="navbar-btn btn-danger btn pull-right">
      <span class="glyphicon glyphicon-star"></span>Copyright 2017</a>
    </div>

如何根据此 FormGroup

设置HTML模板

Answer 1

您可以将HTML模板设置为如下：

<form [formGroup]="HomeAddress">
     <div>Address: <input type="text" formControlName="Address"></div>
     <div formGroupName="HomeAddressDetail">
         <div>Country: <input type="text" formControlName="Country"></div>
         <div formGroupName="Tel">
              Phone No: <input type="text" formControlName="PhoneNo">
              Home No: <input type="text" formControlName="HomeNo">
         </div>
         <div formGroupName="Email">
              Primary Email: <input type="text" formControlName="PrimaryEmail">
              Secondary Email: <input type="text" formControlName="SecondaryEmail">
         </div>
    </div>
</form>

我不知道离子控制，我用角度2回答。你可以在离子2中使用相同的格式。这是plunkr https://plnkr.co/edit/SMCAMddPNmEyHuVS0IK8?p=preview

多嵌套模型驱动形式角度2

1 个答案: