D-Net

<form [formGroup]="myForm">

    <div class="form-group" [ngClass]="{'has-error':!myForm.controls.name.valid && myForm.controls.name.dirty}">

        <label for="entityNameTag">Entity Name</label>

        <input type="text" class="uk-input uk-width-medium" formControlName="name" id="entityNameTag" placeholder="Entity Name">

    </div>

    <div class="form-group" [ngClass]="{'has-error':!myForm.controls.pid.valid && myForm.controls.pid.dirty}">

        <label for="entityPidTag">Entity persistent id for portal</label>

        <input type="text" class="uk-input uk-width-medium" formControlName="pid" id="entityPidTag" placeholder="Entity Pid">

    </div>

<!--

    <div ngModelGroup="phoneNumbers">

      <h3>Phone numbers</h3>

      <div *ngFor="let phoneId of phoneNumberIds; let i=index;">

        <label>Phone number {{i + 1}}</label>

        <input type="text" name="phoneNumber[{{phoneId}}]" #phoneNumber="ngModel" ngModel/>

        <button type="button" (click)="remove(i); myForm.control.markAsTouched()">remove</button>

      </div>

      <button type="button" (click)="add(); myForm.control.markAsTouched()">Add phone number</button>

    </div>

-->

<!-- <div class="form-group" [ngClass]="{'has-error':!myForm.controls.name.valid && myForm.controls.entities.dirty}">

  <div *ngFor="let entity of entities; let i=index;">

    <label>Entity {{i + 1}}</label>

    <input type="text" name="entities[{{entity}}]" class="form-control" formControlName="entity"/>

  </div>

</div> -->

    <input type="hidden" formControlName="_id">

</form>

<!--<pre>-->

<!--{{myForm.value | json}}-->

<!--</pre>-->