Angular 2, не может получить данные после подписки в ngOnInit

У меня проблема, возможно, я не понимаю, как это сделать, но когда я пытаюсь поймать данные из HttpRequest во время angular ngOnInit, мой console.log возвращает мне значение «undefined». Дело в том, что когда я использую это значение в моем представлении шаблона, оно работает!

Вот мой компонент

export class ReferentielFormComponent implements OnInit {
  id: number;
  currentUser;
  referentiel;
  progressValue: number;
  formGroup: FormGroup;
  isNew: boolean;

  constructor(private service: AppService,
          private referentiels: ReferentielService,
          private router: ActivatedRoute,
          private config: NgbTabsetConfig) {
  }

  ngOnInit() {
    this.router.params.subscribe((params: Params) => this.id = params['id']);
    if (this.id) {
      this.referentiels.getReferentiel(this.id).subscribe(data => this.referentiel = data);
    } else {
      this.referentiel = {};
    }
    this.isNew = !this.referentiel;

    console.log(this.referentiel);
    console.log(this.isNew);
    this.progressValue = 20;

    this.formGroup = new FormGroup({
      titre: new FormControl(!this.isNew ? this.referentiel.titre : '', [
        Validators.required,
      ]),
      description: new FormControl(!this.isNew ? this.referentiel.description : '', [
        Validators.required,
      ])
    });
  }
}

Переменная this.referentiel возвращает мне undefined, поэтому я не могу связать свою форму с существующим значением из-за этого ...

Какие-либо предложения ?


http typescript angular subscribe ngoninit
person Valentin Ferey    schedule 17.11.2017    source источник
comment
Может this.id быть нулевым?   -  person Riscie    schedule 17.11.2017
comment
Этот идентификатор не равен нулю! Проблема в том, что this.referentiel имеет значение null при первом прохождении ngOnInit внутри этой функции. Не знаю почему!   -  person Valentin Ferey    schedule 17.11.2017
comment
По умолчанию переменные не определены, следовательно, ссылочные значения не определены. Он становится определенным, когда ему присваивается значение. если идентификатор присутствует, это происходит только в функции подписки. К моменту завершения подписки console.log и formgroup уже были бы выполнены.   -  person Krishnanunni Jeevan    schedule 17.11.2017
comment
@KrishnanunniJeevan Да, я понимаю! Это как раз мой вопрос: / Как мне теперь делать?   -  person Valentin Ferey    schedule 17.11.2017
comment
@ValentinFerey, как я уже ответил, переместите логику, использующую переменную referentiel, в общую функцию. Вызовите его из условия else и внутри функции подписки   -  person Krishnanunni Jeevan    schedule 17.11.2017

Ответы (3)


arrow_upward
1
arrow_downward

Попробуйте вот так:

Тип 1:

ngOnInit() {
    this.router.params.subscribe((params: Params) => {
        this.load(params['id']);
    });
}

load(id) {
    this.id = id;
    console.log('this.id', this.id);
}

Тип 2:

ngOnInit() {
    this.router.params.subscribe((params: Params) => {
        this.id = params['id'];
    }, () => {
        console.log('this.id', this.id);
    });
}
person Chandru    schedule 17.11.2017
comment
Этот идентификатор не равен нулю! Проблема в том, что this.referentiel имеет значение null при первом прохождении ngOnInit внутри этой функции. Не знаю почему! - person Valentin Ferey; 17.11.2017

arrow_upward
0
arrow_downward

Попробуй это:

    ngOnInit() {
        this.router.params.subscribe((params: Params) => this.id = params['id']
        if (this.id) {
          this.referentiels.getReferentiel(this.id).subscribe(data => this.referentiel = data);
        } else {
          this.referentiel = {};
        }
        this.isNew = !this.referentiel;

        console.log(this.referentiel);
        console.log(this.isNew);
        this.progressValue = 20;

        this.formGroup = new FormGroup({
          titre: new FormControl(!this.isNew ? this.referentiel.titre : '', [
            Validators.required,
          ]),
          description: new FormControl(!this.isNew ? this.referentiel.description : '', [
            Validators.required,
          ])
        });
        );
      }

this.is еще не определен вне подписки.

person Melchia    schedule 17.11.2017

arrow_upward

arrow_downward

person    schedule
comment
Это не работает ... У меня новая ошибка: ERROR Ошибка: formGroup ожидает экземпляр FormGroup. Пожалуйста, передайте один. - person Valentin Ferey; 17.11.2017
comment
Это другая ошибка. В шаблоне HTML вы устанавливаете элемент формы ‹form [formGroup] = formGroup› - person Krishnanunni Jeevan; 17.11.2017
comment
Да, этой ошибки не было, пока я не изменил свой код на ваш: / - person Valentin Ferey; 17.11.2017
comment
Можете ли вы обернуть форму в div и поместить ngif. ‹Div * ngIf =! IsNew &&! Referentiel›. Я чувствую, что форма отображается до завершения подписки и выдает эту ошибку - person Krishnanunni Jeevan; 17.11.2017
comment
Извините, это должно быть * ngIf = isNew || справочник. В качестве альтернативы вы можете установить для логической переменной значение false по умолчанию и установить для нее значение true внутри функции buildForm. - person Krishnanunni Jeevan; 17.11.2017