在角度 6 处具有级联组合框的除法组件

Question

我有一个角度6应用程序。并且，我创建了共享country-state组件。它正在完美地工作。

完美工作示例

但是，当我将country-state划分为country和state组件时，我无法填充所选国家/地区的州。如何更改not working example？

不工作示例

Answer 1

在服务中添加一个公共变量以设置国家/地区 ID，并创建一个按国家/地区 ID 过滤的方法

  countryId = null;
  filterStates(){
    if(!this.countryId) return null;
    return this.getStates().filter((item) => item.countryid == this.countryId);
  }

然后从国家/地区

组件设置国家/地区 ID

onSelect(countryid) {
 this.selectService.countryId = countryid;
}

从状态组件中，调用筛选方法

 get states(): State[]{
     return this.selectService.filterStates();
  };

演示