angular - Angular2 custom component button can not Connect to outside form -
i have problem.
my custom component has button reset formcontrolname, it's not work. custom component value rest, value not connect formcontrolname.
ex:https://plnkr.co/edit/r6bbf3?p=preview
my custom component:
export const custom_input_control_value_accessor: = { provide: ng_value_accessor, useexisting: forwardref(() => custominputcomponent), multi: true }; @component({ selector: 'custom-input', template: `<div class="form-group"> <label><ng-content></ng-content> <input [(ngmodel)]="value" class="form-control" (blur)="onblur()" > </label> <button type="button" (click)="clear()">clear</button> </div>`, providers: [custom_input_control_value_accessor] }) export class custominputcomponent implements controlvalueaccessor { private innervalue: = ''; private ontouchedcallback: () => void = noop; private onchangecallback: (_: any) => void = noop; //get accessor value(): { return this.innervalue; }; //set accessor including call onchange callback set value(v: any) { if (v !== this.innervalue) { this.innervalue = v; this.onchangecallback(v); } } //set touched on blur onblur() { this.ontouchedcallback(); } clear(){ this.innervalue = ''; } //from controlvalueaccessor interface writevalue(value: any) { if (value !== this.innervalue) { this.innervalue = value; } } //from controlvalueaccessor interface registeronchange(fn: any) { this.onchangecallback = fn; } //from controlvalueaccessor interface registerontouched(fn: any) { this.ontouchedcallback = fn; } }
Comments
Post a Comment