Angular State Dropdown绑定到Country Select

时间:2015-03-17 21:33:53

标签: javascript angularjs

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

我已经查看了这两个答案,以便为我的实施提供解决方案。

  

Angularjs trigger country state dependency

     

angularjs dependant dropdown option value

但是我不能让他们工作而且错过了什么。

我首选的解决方案是使用一些现有的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工作。

是否存在可用于对象的角度过滤器或者是否可以动态过滤掉对象的条件逻辑?

1 个答案:

答案 0 :(得分:1)

您在此处遇到一些问题(除state.countryidcountry.id不匹配外):

首先track by位于过滤器之后(换句话说,过滤器就在数组之后,因为它会过滤数组)。

第二次,你是对的 - 内置过滤器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>