角度状态下拉列表绑定到国家/地区选择

Question

我正在尝试绑定到国家/地区的上下文状态下拉菜单，以便仅显示相关国家。

我已经看过这两个答案，为我的实现提供了解决方案。

AngularJS触发国家/地区依存关系

与angularjs相关的下拉选项值

但是我无法让他们工作，并且缺少一些东西。

我的首选解决方案将使用一些现有的ng过滤器，但我知道这仅适用于数组而不适用于对象

 <select ng-model="user.state" ng-options="state.name for state in states track by state.id | filter:state.countryid = user.country.id">

我尝试将对象转换为数组，但这似乎不起作用。

我可以创建一个自定义过滤器，但我希望避免这种情况。

 <select ng-model="user.state" ng-options="state.name for state in states track by state.id | customStateFilter:user.country.id">

似乎应该有某种方法可以使ng-options正常工作而不修改数据。

是否存在适用于对象的现有Angular过滤器，或者是否可以执行条件逻辑来动态过滤出对象？

Answer 1

您这里有几个问题（除了state.countryid和country.id不匹配）：

首先 ， track by位于过滤器之后（或换句话说，filter紧接在数组之后，因为它过滤了数组）。

其次 ，您是对的-内置的筛选filter筛选filter仅适用于数组，而不适用于对象。 对于对象，您需要一个自定义过滤器。

最后 ， filter器filter器不接受要计算的表达式（ filter:state.countryid = user.country.id ，更不用说您尝试提供的“表达式”不比较=== ，而是分配= ）。 filter接受一个string作为参数，以匹配任何属性，一个Object指定一个属性来匹配哪个值，或者一个谓词函数。

在您的情况下，所需的就是对象。

将这些东西放在一起，您将获得：

<select ng-model="selectedState"
        ng-options="state.name for state in states | filter: {countryid: user.country.id}:true track by state.id">
  <option value="">select state</option>
</select>