Заполните FormGroup нулевым значением и

Получение ошибки в консоли Chrome: ИСКЛЮЧЕНИЕ: Ошибка: Uncaught (в обещании): TypeError: Не удается прочитать свойство «applicationName» со значением null.

Модель: класс экспорта BasicInfoModel {

    applicationName: string;
    localDirectoryPath: string; 
}

Контроллер отправляет данные в родительский компонент, там родительский компонент сохраняется в сервисах.

Контроллер:

import { Component, Output, OnInit, EventEmitter} from '@angular/core';
import { FormGroup, FormControl, REACTIVE_FORM_DIRECTIVES, Validators,               
FormBuilder, FormArray}from "@angular/forms";
import { Observable } from "rxjs/Rx";
import { BasicInfoModel } from '../basicinfomodel';
import { BasicInfoService} from '../app.dev.basicinfo.service';

@Component({
   selector: 'basic-info',
   templateUrl: './basicInfo.html',
   styleUrls: ['../../ComponentStyles.css'],
   directives: [REACTIVE_FORM_DIRECTIVES]
})

export class BASIC_INFOComponent implements OnInit {

observableBasic: BasicInfoModel;
basicInfoForm: FormGroup;

@Output() basicInfoUpdate = new EventEmitter<JSON>();
@Output() basicInfoFormValid = new EventEmitter<Boolean>();

constructor(private formBuilder: FormBuilder, private BasicInfoService:      
BasicInfoService) {  }

onSubmit() {
    debugger;
    this.observableBasic;
    this.basicInfoUpdate.emit(this.basicInfoForm.value);
}

ngOnInit() {

    this.basicInfoForm = new FormGroup({
        'applicationName': new FormControl('', Validators.required),
        'localDirectoryPath': new FormControl('', Validators.required)
    });

    this.basicInfoForm.valueChanges.subscribe(data => console.log('form   
    changes', data));
    this.BasicInfoService.currentBasicInfo
        .subscribe(
        (basic: BasicInfoModel) => {
            this.observableBasic = basic;
        });

    (<FormGroup>this.basicInfoForm).setValue(this.observableBasic, { onlySelf: true });
}

}

Чего я хочу достичь:

  1. Когда я создаю свой код, я хочу, чтобы моя группа форм была заполнена нулевыми значениями.
  2. когда я заполнил данные и сохранил их в behaviorSubject в своих службах, последний, когда я снова посещаю страницу, моя formGroup должна быть синхронизирована со службами данных.

javascript angular angular-material2 rxjs5
person Hank    schedule 04.10.2016    source источник

Ответы (1)


arrow_upward
1
arrow_downward

Изменил контроллер, добавив: (this.observableBasic != undefined)

ngOnInit() {
    this.basicInfoForm = new FormGroup({
        'applicationName': new FormControl('', Validators.required),
        'localDirectoryPath': new FormControl('', Validators.required)
    });

    this.BasicInfoService.currentBasicInfo
        .subscribe((basic: BasicInfoModel) => { this.observableBasic = basic; });

    if (this.observableBasic != undefined) {
        (<FormGroup>this.basicInfoForm).setValue(this.observableBasic, { onlySelf: true });
    }      

    this.basicInfoForm.valueChanges.subscribe(data => console.log('form changes', data));
}
person Hank    schedule 04.10.2016