// angular2/packages/forms/src/directives/ng_control.ts 片段 export abstract class NgControl extends AbstractControlDirective { /** @internal */ _parent: ControlContainer = null; name: string = null; valueAccessor: ControlValueAccessor = null; ... abstract viewToModelUpdate(newValue: any): void; }
AbstractControlDirective 抽象类
// angular2/packages/forms/src/directives/abstract_control_directive.ts 片段 export abstract class AbstractControlDirective { get valid(): boolean { return this.control ? this.control.valid : null; } get invalid(): boolean { return this.control ? this.control.invalid : null; } get errors(): ValidationErrors | null { return this.control ? this.control.errors : null; } get pristine(): boolean { return this.control ? this.control.pristine : null; } get dirty(): boolean { return this.control ? this.control.dirty : null; } get touched(): boolean { return this.control ? this.control.touched : null; } get untouched(): boolean { return this.control ? this.control.untouched : null; } get valueChanges(): Observable<any> { return this.control ? this.control.valueChanges : null; } hasError(errorCode: string, path: string[] = null): boolean { return this.control ? this.control.hasError(errorCode, path) : false; } getError(errorCode: string, path: string[] = null): any { return this.control ? this.control.getError(errorCode, path) : null; } }
ngModelGroup 有什么作用？
ngModelGroup 指令是 Angular 提供的另一特殊指令，可以对表单输入内容进行分组，方便我们在语义上区分不同性质的输入。例如联系人的信息包括姓名及住址，现在需对姓名和住址进行精细化信息收集，姓名可精细化成姓和名字，地址可精细化成城市、区、街等。此时就可以将姓名及住址进行分组收集，具体如下:
<form #concatForm = "ngForm"> <fieldset ngModelGroup="nameGroup" #nameGroup="ngModelGroup"> <label>姓:</label> <input type="text" [(ngModel)]="curContact.firstname" required> <label>名字:</label> <input type="text" [(ngModel)]="curContact.lastname" required> </fieldset> <fieldset ngModelGroup="addressGroup" #addressGroup ="ngModelGroup"> <label>街:</label> <input type="text" [(ngModel)]="curContact.street" required> <label>区:</label> <input type="text" [(ngModel)]="curContact.zip" required> <label>城市:</label> <input type="text" [(ngModel)]="curContact.city" required> </fieldset> </form>
上述例子分别对联系人的姓名和住址进行分组， ngModelGroup 将姓和名字的表单内容进行包裹组成姓名分组，将城市、区和街道的表单内容进行包裹组成住址分组。此时concatForm.value值为:
{ nameGroup: { firstname: ''， lastname: ''， }， addressGroup: { street: ''， zip: ''， city: '' } }
总结
以上就是这篇文章的全部内容了，希望本文的内容对大家的学习或者工作能带来一定的帮助，如果有疑问大家可以留言交流，谢谢大家对脚本之家的支持。
您可能感兴趣的文章: