Question

这个完整的矩阵是可观察的：

DDA     DDB    DDC     DDD     DDE    DDF
A   |    B   |  C   |   D   |   E   |   F
----|--------|------|-------|-------|-------
2   |   4    |  6   |   2   |   5   |   7
3   |   3    |  6   |   0   |   6   |   8
3   |   6    |  5   |   1   |   6   |   8
5   |   0    |  1   |   1   |   1   |   5
1   |   2    |  2   |   0   |   1   |   5

Here every column is an Observable

示例 ObservableA []：在A列上方
ObservableB []：在B列上，依此类推



And next
ObservableB[i] = ObservableA[i].pipe();
And similarly further ...

where DDA , DDB , DDC,DDD,DDE,DDF are also Observable over respective columns
ALL DROPDOWNS ARE MUTLI-SELECT

DDA -> ObservableA
DDB -> ObservableB
DDC -> ObservableC
DDD  -> ObservableD and so one

问题：

我希望所有下拉列表在相应的列中都具有唯一值

和如果DDA可观察到，我们还从下拉列表中选择了2,3值

然后，展开时所有其他下拉菜单的可用值应为

DDB : 4,3,6 DDC : 6,5 DDD : 2,0,1 DDE : 5,6 DDF : 7,8

这适用于所有下拉菜单表示：如果DDC更改，则所有列均应分别更改

我该如何实现。请帮助我

Answer 1

根据我的评论，如果有多个，我们需要更改一些函数getLang

  //remember that array.value if the value of multiple select, e.g. ["German","Frech"]

  getLang(i, array, languageList) {
    return i == 0 ? languageList :
      this.getLang(i - 1, array, languageList.
         filter(x => !array[i-1].value || array[i-1].value.indexOf(x.name)<0))
  }

然后，当将数组更改为不等于null时，否则删除ngOnInit中的值

this.formArray.controls.forEach(form => {
      form.get('options').valueChanges.subscribe(res => {
        res.forEach((x, index) => {
          if (index>0)
          {
            const group=(form.get('options') as FormArray).at(index);
            if (group.value) //if it's not null
            {
             //calculate in optionsSelected all the options selected before 
            let options=res.slice(0,index)
            let optionsSelected=[]
            options.forEach(x=>{
              optionsSelected=[...optionsSelected,...x]
            })
            //we make a filter
            let newValue=group.value?group.value.filter(y=>optionsSelected.indexOf(y)<0):null
            //if the result of the filter is an empty array
            //we give a null value, elese the filtered result
            group.setValue((newValue && newValue.length>0?newValue:null), { emitEvent: false })
            }
          }
        })
      })

请参见stackblitz

角可观察矩阵解

问题：

1 个答案: