Question

我有两个json数据问题包括问题名称，类型等。数据包括受访者对问题的答案。

所有问题都包含在过滤器组件中，其中，过滤来自共享服务的问题

api.service.ts

 getQuestions(): Observable<any>{
   //For WebService Questions
  return this.http
  .get('../assets/samplequestion.json').pipe(
    map(response => {
      // this._questionsArray = response.json();
      return response.json();
    }),catchError(this.handleError));

  }

 getFilters(object){
  this._dataArray.length = 0;
  this._dataArray.push(object);
}

filters.component.html

 <div class="form-check form-group" *ngFor="let option of filters.rows;  let i = index;">
                <input type="checkbox" class="form-check-input" [attr.id]="filters.question + '_' + (i+1)"  [(ngModel)]="option.checked" (ngModelChange)="UpdateData()" [checked]="true"/>

filters.component.ts

UpdateData(){
    this.apiService.getFilters(this._filters);
  }

然后是另一个组件以显示过滤的数据。

questions.component.ts

  GetHits(questionArr, dataArr): void {
      //filtering happen here.
    }

ngOnInit(): void {
 this._questions  = this.apiService._dataArray
   this.getData().subscribe(() => {
    this.GetHits(this._questions, this._data);
   })

当单击_finalArray复选框时：问题组件在数组推送上更新，但在GetHits函数中没有更新，我想我应该在数据绑定中使用可观察的，而不是数组推送？

这是我的完整代码速写 https://stackblitz.com/edit/angular-fdbmkx

在共享服务的组件之间使用筛选器进行数据绑定

0 个答案: