从NG选项选择滤波器NG选项

问题描述

我希望能解决三个问题...

在我的应用程序的网页我有一个选择的状态，另一个用于县。对于状态我有：

 ＆LT;选择NG模型=filter.stateIDNG选项=item.stateID作为item.state在st_option项目＆GT;
＆LT; /选择＆GT;
 

数据：

[
  {状态=加州，STATEID =5}，
  {状态=亚利桑那，STATEID =3}，
  {状态=俄勒冈州，STATEID =38}，
  {状态=得克萨斯，STATEID =44}，
  {状态=犹他，STATEID =45}，
  {状态=内华达，STATEID =29}
]


有关我县选择我有：

 ＆LT;选择NG模型=filter.countyIDNG选项=item.countyID作为item.county在co_option项GT＆;
 ＆LT; /选择＆GT;
 

数据：

[
  {县=橙色，countyID =191，co_state_id =5}，
  {县=多个区县，countyID =3178，co_state_id =3}，
  {县=索诺玛，countyID =218，co_state_id =38}，
  {县=洛杉矶，countyID =190，co_state_id =44}
]


这是我的 NG-重复：

 ＆LT; D​​IV NG重复=项目工程|过滤：过滤器＆GT;
    ＆LT; D​​IV＆GT;
        状态：{{project.state}}＆LT; BR＆GT;
        县：{{project.county}}＆LT; BR＆GT;
        ＆LT;跨度NG隐藏={{project.stateID}}＆GT;＆LT; / SPAN＆GT;
        ＆LT;跨度NG隐藏={{project.countyID}}＆GT;＆LT; / SPAN＆GT;
    ＆LT; / DIV＆GT;
＆LT; / DIV＆GT;
 

所以，你可以看到我使用 STATEID 上的状态来选择和县我选择我在 co_state_id 在县城的数据集。

我想要做的几件事情：

1. 隐藏县选择，直到选择的状态。


2. 的状态选定后，过滤由县选择选项选中 STATEID / co_state_id


3. 过滤 NG-重复首先将 STATEID ，再由 countyID 。

我还没有看到一个方法来设置 filter.stateID 到真正或由多个过滤器，而不是的字符串。当我通过STATEID筛选我得到不同的结果，因为有些 STATEID 的可以在其中有1。

解决方案

通常你只是想问问每个职位的一个问题，但我给这三个出手了。

第1部分：添加 NG-节目为 filter.stateID 。既然你无法取消的状态，可以使用一次性绑定，如果你的角度是1.3 ^

 ＆LT;选择NG秀=:: filter.stateIDNG模型=filter.countyIDNG选项=item.countyID作为item.county的项co_option＆GT;
 

第2部分：添加过滤器 {co_state_id：filter.stateID}

 ＆LT;选择NG秀=！:: filter.stateID = NULLNG模型=filter.countyIDNG选项=item.countyID为item.county在co_option项目|过滤器：{co_state_id：filter.stateID}GT＆;
 

第3部分

您正在使用过滤器的模式对象，不应该的问题，如果id的值是1：

Working Snippet

var app = angular.module('app', []);

app.controller('myController', function($scope) {
  $scope.projects = [{
    name: 'Project1',
    state: 'CA',
    stateID: '5',
    county: 'Orange',
    countyID: '191'
  }, {
    name: 'Project2',
    state: 'CA',
    stateID: '5',
    county: 'LosAngeles',
    countyID: '190'
  }, {
    name: 'Project3',
    state: 'CA',
    stateID: '5',
    county: 'Orange',
    countyID: '191'
  }, {
    name: 'Project4',
    state: 'MadeUp',
    stateID: '1',
    county: 'MadeUp',
    countyID: '190'
  }];

  $scope.st_option = [{
    state: "California",
    stateID: "5"
  }, {
    state: "Arizona",
    stateID: "3"
  }, {
    state: "Oregon",
    stateID: "38"
  }, {
    state: "Texas",
    stateID: "44"
  }, {
    state: "Utah",
    stateID: "45"
  }, {
    state: "Nevada",
    stateID: "29"
  }];

  $scope.co_option = [{
    county: "Orange",
    countyID: "191",
    co_state_id: "5"
  }, {
    county: "Multiple Counties",
    countyID: "3178",
    co_state_id: "3"
  }, {
    county: "Sonoma",
    countyID: "218",
    co_state_id: "38"
  }, {
    county: "Los Angeles",
    countyID: "190",
    co_state_id: "44"
  }];

  $scope.filter = {};
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script>
<div ng-app='app' ng-controller='myController'>
  <select ng-model="filter.stateID" 
          ng-options="item.stateID as item.state for item in st_option"></select>
  <select ng-show="::filter.stateID" 
          ng-model="filter.countyID" 
          ng-options="item.countyID as item.county for item in co_option | filter:{ co_state_id : filter.stateID }">
  </select>

  <div ng-repeat="project in projects | filter:filter">
    <div>
      <br>Name: {{ project.name }}
      <br>State: {{project.state}}
      <br>County: {{project.county}}
      <br>
      <span ng-hide="{{project.stateID}} "></span>
      <span ng-hide="{{project.countyID}} "></span>
    </div>
  </div>
</div>

这篇关于从NG选项选择滤波器NG选项的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！