Angular2~6 [(ngModel)] 与 formCon

2018-11-26  本文已影响0人  niccky

sku-info.html

<form [formGroup]="form">
    <div>
        <input [(ngModel)]="itemName" [ngModelOptions]="{standalone: true,updateOn:'blur'}" />
    </div>
    <div>
      <input formControlName="itemId" />
    </div>
    <div>
      <input [(ngModel)]="form.value.childId" [ngModelOptions]="{standalone:true}" />
    </div>
</form>
<h2>updateOn:'blur'</h2>
<p>itemName:{{itemName}}</p>
<p>childId:{{form.value.childId}} </p>

sku-info.ts

import {Component} from '@angular/core';
import {FormGroup,FormBuilder} from '@angular/forms';

@Component({
  selector:"sku-info",
  templateUrl:'./sku-info.html'
})
export class SkuInfoComponent {
  form:FormGroup;
  itemName:string = "测试商品测试商品测试商品";
  constructor(private fb:FormBuilder){}
  ngOnInit(){
    this.form = this.fb.group({
      itemId:[332532532],
      childId:[2424]
    })
  }
}

深圳 天之骄子

上一篇下一篇

猜你喜欢

热点阅读