Javascript 如何使其多部分选择过滤角度

HTML

如何进行多部分选择过滤？ 下面是列表的示例：

选择下拉列表时，应该有默认值，即

日期->全部->升序->取消分组

应该是这样的

---

我修改了下面链接中的代码

我为每个过滤器元素添加了条件图标

 <i nz-icon nzType="check" *ngIf="activeFilter.filterBy=='Application'" nzTheme="outline"></i>

---

你能创建stackblitz示例吗please@pc_coder这里，先生

 activeFilter = {
    filterBy: 'Date',
    length: 100,
    status: 'ALL',
    order: 'ASC',
    grouped: false
  };

handleFilter(targetFilter?: string, value?: any) {
    this.activeFilter[targetFilter] = value;

    console.log(this.activeFilter);
    if (targetFilter === 'order') {
      // ?direction = 'asc' || 'desc']
    }
  }

 <i nz-icon nzType="check" *ngIf="activeFilter.filterBy=='Application'" nzTheme="outline"></i>

<a nz-dropdown nz-tooltip nzTitle="Feature not functional">
        {{ activeFilter.filterBy }} ->  {{ statuName(activeFilter.status) }} ->  {{ activeFilter.order=="ASC" ? "Ascending" : "Descending" }} ->  
        {{ activeFilter.grouped? "Groupped" : "Ungrouped" }}
      </a>

 statuName(param){
    if(param=="ALL"){return "All"}
    else if(param=="ACK"){return "Acknowledged"}
    else if(param=="READ"){return "Read"}
    else if(param=="NEW"){return "New"}
  }

.divider {
          height: 11px !important;
          margin: 4px 0;
          overflow: hidden;
          line-height: 0;
          background-color: #e8e8e887;
      }