@input变量被填充上的HTTP请求

以我app.component.ts我调用一个函数从返回一个HTTP请求的结果的服务：@input变量被填充上的HTTP请求

questions: QuestionBase<any>[]; 
constructor(service: QuestionService) { 
    this.questions = service.getQuestions().subscribe(val => console.log(val)); //gets logged after the other console log below 
}

在子组件此questions阵列被进一步处理：

@Input() questions: QuestionBase<any>[] = []; 
form: FormGroup; 

constructor(private qcs: QuestionControlService) {} 

ngOnInit() { 
    console.log("onInit", this.questions); //called before questions is filled 
    this.form = this.qcs.toFormGroup(this.questions); 
}

我的问题是现在toFormGroup函数ngOnInit在HTTP请求尚未完成时调用得太早。我不习惯Observables。在getQuestions中的HTTP请求完成后，我怎么能够调用该函数？我已经尝试过ngOnChanges，但它在ngOnInit之前甚至会被调用。

来源

2017-04-25 maidi

您可以通过在ngOnChanges检查设置的条件，如果问题与他们做任何事情之前都值：

ngOnChanges() { 
    if(questions && questions.length) { 
    this.form = this.qcs.toFormGroup(this.questions); 
    } 
}

来源

2017-04-25 10:05:54 Alex

偏离主题中阵列不是空的，但你的猫太可爱了！ @ AJT_82 – n00dl3

@ n00dl3哈哈，谢谢！：D她有一个姐姐，她也很可爱，因为被睁眼和几乎完全失明：P也许你看过这张照片，是我的最后一张个人照片..我以为她需要休息一下才能代表我：D http：///imgur.com/a/m2s0d – Alex

您可以在ngOnChanges中调用toFormGroup。而且，如果您需要，只有在问题获得第一个值时才致电给FormGroup。我现在在手机上，所以我无法提供代码示例。

来源

2017-04-25 09:53:45 gonzofish

我已经尝试过在'ngOnChange'，而不是'ngOnInit'调用，但它仍然是该行之前叫：'this.questions = service.getQuestions（）认购（VAL =>的console.log（VAL。））;''被记录，所以'questions'数组是空的，我得到错误。 – maidi

你可以检测到它是否是第一次更改，或者在ngOnChanges – gonzofish

首先，您需要将值分配给认购（）调用中的问题：

service.getQuestions().subscribe(val => this.questions=val);

此外，在子组件，可以实现ngOnChanges()并跳过第一个绑定到@Input()属性时的值仍null.The SimpleChange类有一个博奥利安属性firstChange。

ngOnChanges(changes: {[key: string]: SimpleChange}) { 
    if (!changes.questions.firstChange){ 
     this.form = this.qcs.toFormGroup(this.questions);} 

    }

来源

2017-04-25 10:15:50

我收到错误：'，'预期，无法找到名称'键'，属性'问题'不存在类型'[任何，字符串]' – maidi

@ YakovFain犯了一个错字，我编辑他的回答。 – n00dl3

请注意，最好检查是否定义了“问题”，而不是检查第一次更改，如果该组件在其他地方使用，而不是异步填充“问题”。 – n00dl3

@input变量被填充上的HTTP请求

回答

相关问题