更新

Question

我正在尝试根据用户选择的输入提取特定的JSON值，并将其转换为QuestionBase<any>[]。目前，我这样做只适用于提取test：

// dropdown HTML
<select class="form-control" name="test" id="test" (ngModel)="test" (change)="onSelectChange($event, test.form)">
       <option selected disabled hidden style='display: none' value=''></option>
       <option value="test">Test</option>
       <option value="other">Other</option>
</select>

// question-list.component.ts
onSelectChange($event: any, form: NgForm) {
    this.getQuestions();
}
getQuestions() {
    this.questionService.getQuestions()
        .subscribe(questions => this.questions = questions.sort((a, b) => a.order - b.order),
        error => this.errorMessage = <any>error);
}

// question.service.ts
getQuestions(): Observable<QuestionBase<any>[]> {
return this.http.get(this.jsonUrl)
  .map(this.extractTest)
  .catch(this.handleError);
}
private extractTest(res: Response) {
 let body = res.json();
 return body["test"] || {};
}

// JSON
{
    "test": [{
               key: 'firstName',
               label: 'First name',
               value: 'Bombasto',
               required: true,
               order: 1
            }, {
              key: 'brave',
              label: 'Bravery Rating',
              options: [
               {key: 'solid',  value: 'Solid'},
               {key: 'great',  value: 'Great'},
               {key: 'good',   value: 'Good'},
               {key: 'unproven', value: 'Unproven'}
               ],
              order: 2
            }],
    "other": [{
            key: 'emailAddress',
            label: 'Email',
            type: 'email',
           order: 1
        }]   
}

到目前为止，我已尝试将所选值作为参数传递给getQuestions()和extractTest，以便我可以在body[selected] || {}中返回extractTest，但是当我这样做时，我在我的订阅函数中得到一个未定义的对象，并且排序引发错误。我想我可能会误解地图或订阅的工作方式。

有人对如何做到这一点有任何想法吗？

Answer 1

可能你必须发送如下参数： -

// question.service.ts
getQuestions(): Observable<QuestionBase<any>[]> {
return this.http.get(this.jsonUrl)
  .map(res => this.extractTest(res))  //here you have to send parameter and return it back to the subscribe function
  .catch(this.handleError);
}
private extractTest(res: Response) {
 let body = res.json();
 return body["test"] || {};
}

如果没有解决，你的问题请在这里发表评论。

更新

根据我的说法，如果您使用.map多行，则必须使用return关键字将其返回给某些内容，但是当您使用简单的单行.map时，则不需要写return。根据我的主要区别。所以在你的情况下试试这个

return this.http.get(this.jsonUrl).map(res => { return this.extractTest(res, selected); }) .catch(this.handleError);

而不是

return this.http.get(this.jsonUrl).map(res => { this.extractTest(res, selected); }) .catch(this.handleError);

Angular 2根据选定的表单值提取JSON

1 个答案:

更新