Невозможно использовать FormGroup в ng-шаблоне - PullRequest
Новая
       44

Невозможно использовать FormGroup в ng-шаблоне

0 голосов
/ 26 сентября 2019

У меня ошибка при назначении значения определенной форме в моем файле HTML / TS.Что я делаю не так?Просто пытаюсь присвоить значение из раскрывающегося списка для группы форм, а затем взять значение и выполнить X. Или как лучше всего использовать то, что мне нужно, чтобы взять это значение из раскрывающегося списка? 

<!-- Potential leads modal -->
<ng-template #dialogMatSelect id="potential-leads-modal" [formGroup]="form">
    <h2 mat-dialog-title id="modal-title">Assign Leads</h2>
    <h3 id="modal-sub-title">Assign {{ totalLeadsSelected }} SmartrCalc 
   Lead<span *ngIf="totalLeadsSelected > 1">s</span> to an adviser. 
</h3>
    <mat-select class="advisers-dropdown" placeholder="Select an adviser" formControlName="AdviserId">
        <mat-option *ngFor="let adviser of advisers" [value]="adviser.NodeId">
            {{ adviser.Name }}
        </mat-option>
    </mat-select>
    <div class="buttons-potential-lead" fxLayout fxLayout.xs="column" fxLayoutAlign="center" fxLayoutGap="10px" fxLayoutGap.xs="0">
        <button mat-raised-button type="button" color="primary" class="adviser-toggle-button" id="cancel-button" fxFlex fxFlexOffset="0px">
            Cancel
        </button>
        <button mat-raised-button type="button" color="primary" class="adviser-toggle-button" fxFlex="200px" (click)="assignPotentialLeads()">
            Assign Leads
        </button>
    </div>
</ng-template>

И мой файл TS 

export class PotentialLeadsComponent extends SmartrComponent implements OnInit {

    constructor(private fb: FormBuilder, ) {super();}

    potentialLeads: SmartrCalcLead[] = [];

    potentialSelectedLeads: number[];
    form: FormGroup;

    @ViewChild('dialogMatSelect') dialogMatSelect: any;

    ngOnInit() {

        this.form = this.fb.group({
            AdviserId: null,
            SelectedLeads: null
        });
    }


    get totalLeadsSelected(): number {
        return this.potentialLeads.filter(lead => lead.IsSelected ===
            true).length;
    }

    private getAllAdvisers() {
        this.adviserTreeService.fetchAllAdvisersInCompanyAsTree()
            .pipe(takeUntil(this.ngUnsubscribe$))
            .subscribe(data => {
                this.advisers = data.Advisers;
            });
    }


    assignPotentialLeads() {
        if (this.form.valid) {
            const adviserId = this.form.get('AdviserId').value;
            this.potentialLeads.forEach(function (val) {
                if (val.IsSelected === true) {
                    this.potentialSelectedLeads.push(val);
                }
            });

            this.smartrCalcService.putLeads(adviserId,
                this.potentialSelectedLeads);
        }
    }
}

1 Ответ

0 голосов
/ 29 сентября 2019

Опубликовано от имени ОП

Причина, по которой у меня возникла эта ошибка, заключается в том, что мы не можем использовать группу форм с ng-шаблоном.NG-шаблон не отображается в DOM, следовательно, ошибка.Таким образом, я должен был обернуть все в div.Как <ng-template> -> <div formGroup> и все работает как шарм.

...