angular - Using NgForm and NgControlGroup in Angular2 Forms -

i can code forms 1 controlgroup i'm having trouble multiple controlgroups. according example code, ngcontrolgroup should used inside <div> elements , ngform should used in <form> element. here's markup:

<form ng-form="main" (ng-submit)="handlesubmit()">   <div ng-control-group="group1" >     <input ng-control="c1"><br /><br />     <input ng-control="c2"><br /><br />   </div>   <div ng-control-group="group2">     <input ng-control="c3"><br /><br />     <input ng-control="c4"><br /><br />   </div>     <input type="submit" value="submit"> </form> 

here's code component's constructor:

  constructor() {     this.group1 = new controlgroup({       "c1": new control("first"),        "c2": new control("second")});      this.group2 = new controlgroup({       "c3": new control("third"),        "c4": new control("fourth")});      this.main = new controlgroup({       "g1": this.group1, "g2": this.group2});   } 

i don't errors when launch component, controls don't take initial values ("first", "second", , on). means html elements aren't being bound controls. thoughts? there examples use ngform , ngcontrolgroup?

i figured out wrong. ngmodelform directive should used instead of ngmodel. also, <input> elements should mention proper names of controlgroups. here's result:

<form [ng-form-model]="main" (ng-submit)="handlesubmit()">   <div ng-control-group="g1" >     <input ng-control="c1"><br /><br />     <input ng-control="c2"><br /><br />   </div>   <div ng-control-group="g2">     <input ng-control="c3"><br /><br />     <input ng-control="c4"><br /><br />   </div>     <input type="submit" value="submit"> </form>