Угловая 2/4: присвоить значение массива из функции обещания на уровне обслуживания переменной в компоненте

Question

Я вызываю функцию post в слое сервиса, используя Promise, который возвращает мне JSONArray. Я могу получить его в слое компонентов, но не могу присвоить переменной.

То, что я пробовал, это:

config;


ngOnInit() {
    this.dataService.getTemplateData(this.templateId).then(result => this.config = result)
          .catch(error => console.log(error));
  }

:: result is printing jsonArray properly

Я получаю следующую ошибку в консоли.

AppComponent.html:34 ERROR TypeError: Cannot read property 'forEach' of undefined
    at DynamicFormComponent.webpackJsonp.../../../../../src/app/dynamic-form/containers/dynamic-form/dynamic-form.component.ts.DynamicFormComponent.createGroup (dynamic-form.component.ts:24)
    at DynamicFormComponent.webpackJsonp.../../../../../src/app/dynamic-form/containers/dynamic-form/dynamic-form.component.ts.DynamicFormComponent.ngOnInit (dynamic-form.component.ts:19)
    at checkAndUpdateDirectiveInline (core.es5.js:10843)
    at checkAndUpdateNodeInline (core.es5.js:12341)
    at checkAndUpdateNode (core.es5.js:12284)
    at debugCheckAndUpdateNode (core.es5.js:13141)
    at debugCheckDirectivesFn (core.es5.js:13082)
    at Object.eval [as updateDirectives] (AppComponent.html:34)
    at Object.debugUpdateDirectives [as updateDirectives] (core.es5.js:13067)
    at checkAndUpdateView (core.es5.js:12251)

Я ожидаю:

config = [
    {
      "type": "input",
      "label": "Full name",
      "name": "name",
      "placeholder": "Enter your name"
    },
    {
      "type": "select",
      "label": "Favourite food",
      "name": "food",
      "options": ["Pizza", "Hot Dogs", "Knakworstje", "Coffee"],
      "placeholder": "Select an option"
    },
    {
      "label": "Submit",
      "name": "submit",
      "type": "button"
    },
  ];

Следующая моя логика .html: -

  <div class="app">
            <dynamic-form [config]="config">
            </dynamic-form>
  </div>

Мой уровень обслуживания :

getTemplateData (данные: любые): Обещание {

let headers = new Headers({ 'Content-Type': 'application/json' });
let options = new RequestOptions({ headers: headers });
return this.http
        .post(this.templateDataUrl, data, options)
    .toPromise()
    .then(this.extractData)
    .catch(this.handleError);
}

 private extractData(res: Response) {
    let body = res.json();
    return body || {};
}

Answer 1

Правильно инициализируя переменную конфигурации, я смог присвоить данные параметру

config: any[] = [];

Answer 2

Пожалуйста, поделитесь полным кодом dynamic-form.component. будет легко отследить проблему.

DynamicFormComponent.createGroup (dynamic-form.component.ts:24)

в приведенной выше строке, конфигурация не определена, поэтому выдает ошибку Вы должны вызвать creatGroup() метод, подобный этому

 this.dataService.getTemplateData(this.templateId).then(result => {
    this.config = result;
    this.creatGroup()
}).catch(error => console.log(error));