根据一些观测值过滤Angular 8中的多个下拉值

我有以下表单控件(parent1,parent2,parent3),它们是复选框。 当用户选中/取消选中其中任何一个时,以下表单数组由多个选择复选框组成,并带有以下示例数据:

  // Child1 with Parents - parent1,parent2,parent3
   c1Data = [
      {"id":1,"desc":"a","p1":0,"p2":1,"p3":1,"selected": false,"disabled": false },{"id":2,"desc":"b",{"id":3,"desc":"c","p1":1,"p3":0,];

// Child2 with Parents - parent2,parent3,child1
   c2Data = [
      {"id":10,"desc":"d","c1": 1,{"id":20,"desc":"e",{"id":30,"desc":"f","c1": 2,{"id":40,"desc":"g","c1": 3,];

// Child3 with Parents - parent1,child1,child2
   c2Data = [
      {"id":100,"desc":"i","p2":0,"c2": 10,{"id":200,"desc":"j","c2": 20,{"id":300,"desc":"k","c2": 30,{"id":400,"desc":"l","c2": 40,];

// The dependency is 
// User selects: p1=1,p2=0,p3=1,c1=2,3 => 
// c1 => set disabled = true for all items with p1 !== 1,p3 !== 1 
// c2 => set disabled = true for all items with p3 !== 1,c1 not in [2,3]
// c3 => set disabled = true for all items with p1 !== 1,p3 !== 1,3]
//  For c1,c2,c3 set disabled = false for all other items
//  If any item selected in c1,c2 and c3 - if the item(s) are disabled,set selected = false
//  If any parent is not selected,do not apply filter on that parent column

我正在尝试使用更高阶的观测值来实现这一目标:

  const p1$ = this.parent1.valueChanges.pipe(map(val => val ? 1 : 0));
  const p2$ = this.parent2.valueChanges.pipe(map(val => val ? 1 : 0));
  const p3$ = this.parent3.valueChanges.pipe(map(val => val ? 1 : 0));

  //For child1 jsut a sample
// not sure if the below operator and combination is correct
  combineLatest([p1$,p2$,p3$]).pipe(
            switchMap(([p1,p2,p3]) => {
                  return  c1Data.map(c1 => {
                        c1.disabled = c1.p1 === p1 && c1.p2 === p2 );
                    });
                }
            )).subscribe(data => {
                this.updateFormArray(data,'child1formarray');
            });
// The issues I face are:
// - None of the valuechanges fires
// - I do not want to apply c1.p1 === p1 when p1 is not set (ex: p1 === 0)
// - In case of c2,c3,when c1 = [],i dont want to filter by c1,just set all values to disabled = false
//I also ave a object that will have the properties for selected filters
//I update as user checks/unchecks each value
selected {
p1: [1],p2: [0],p3: [1],c1: [2,3] 
} //c2,c3 are not added as they do not have a selection. All properties are nullable
// I can also use this in SwitchMap instead of the array of the individual observables

非常感谢您的帮助和指导。提前谢谢!

iCMS 回答:根据一些观测值过滤Angular 8中的多个下拉值

暂时没有好的解决方案,如果你有好的解决方案,请发邮件至:iooj@foxmail.com
本文链接:https://www.f2er.com/2095769.html

大家都在问