在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問答/HTML5/ ng6 自定義表單控件,無法拿到數(shù)據(jù)問題

ng6 自定義表單控件,無法拿到數(shù)據(jù)問題

目前用ng6自定義了一個表單控件,app-popup-search,但是當(dāng)在form表單中使用時,卻無法獲取到其相應(yīng)的值,麻煩幫忙看下,謝謝了。

自定義表單控件代碼:

import { FormGroup,FormBuilder,NG_VALUE_ACCESSOR } from '@angular/forms';
import { ControlValueAccessor } from '@angular/forms';
import { Component, OnInit,Inject,forwardRef,ChangeDetectionStrategy } from '@angular/core';
import { MatDialog, MatDialogRef, MAT_DIALOG_DATA} from '@angular/material';
import { ConfirmDialogComponent} from "../confirm-dialog";


@Component({
    selector: 'app-popup-search',
    template: `
        <form [formGroup]="form">
            <div class="input-group">
                <input type="text" formControlName="testName"  (change)="on1Change()" class="form-control" placeholder="hello worlds">
                <span class="input-group-addon pointer"  mat-raised-button   (click)="openSearchDialog()">查找</span>
            </div>
        </form>
        
    `,
    styles: [`

    `],
    providers:[
        ConfirmDialogComponent,
        {
            provide: NG_VALUE_ACCESSOR,
            useExisting: forwardRef(() => PopupSearchComponent),
            multi: true,
          },
    ],
    changeDetection: ChangeDetectionStrategy.OnPush,
})
export class PopupSearchComponent implements  ControlValueAccessor,OnInit {
    private propagateChange = (_: any) => {};
    names:string;
    form:FormGroup;
    selectedData:string;

    constructor(public dialog:MatDialog,
                private fb:FormBuilder
                ) { }

    ngOnInit() {
        this.form=this.fb.group({
            testName:[]
        });
    }
    
    openSearchDialog():void{
        const dialogRef=this.dialog.open(ConfirmDialogComponent,{
            width:"850px",
            data:{names:"wangkai"}
        });

        dialogRef.afterClosed().subscribe(result => {
            this.selectedData=result.names;
            this.form.get("testName").setValue(result.names,{emitEvent: false, emitModelToViewChange: true, emitViewToModelChange: true});
            this.propagateChange(result.names);
            console.log(`Dialog result: ${result.names}`); // Pizza!
          });
    }

    public on1Change(){
        console.log(this.selectedData);
        this.propagateChange(this.selectedData);
    }

    

    public writeValue(obj:string){
        console.log(obj);
        if(obj){
            this.form.get("testName").patchValue(obj);
        }
    }

    public registerOnChange(fn:any){
        console.log(fn);
        this.propagateChange(fn);
    }

    public registerOnTouched(){
    
    }
}

form表單使用代碼HTML:

<form [formGroup]="formMultiple" (ngSubmit)="aaSubmit()">
        <div class="row">
                <div class="col-sm-6">
                    <div class="row">
                        <div class="col-sm-3">
                            <label for="">Name</label>
                        </div>
                        <div class="col-sm-9">
                            <app-popup-search ngDefaultControl formControlName="name"></app-popup-search>
                        </div>
                    </div>
                </div>
        </div>
</form>

TS代碼:

 ngOnInit() {
        this.formMultiple=this.fb.group({
            "name":[""]
        });
    }

麻煩大神幫忙看下,謝謝了!

回答
編輯回答
抱緊我

找到問題了,是因為以下寫錯了

    public registerOnChange(fn:any){
        console.log(fn);
        this.propagateChange(fn);
    }

改為:

public registerOnChange(fn:any){
        console.log(fn);
        this.propagateChange=fn;
    }
2017年6月29日 18:02