如何在Html的下拉菜单中访问匹配的数据？
我想从angularjs访问匹配的数据，如：
下面是我想要访问的列表：
$scope.orderStatus = [ { os: 'Open', value: 1 }, { os: 'Completed', value: 2 }, { os:'Cancelled',value: 3 }, { os: 'Rejected', value: 4 } ]
下面是访问列表元素。
<tr ng-repeat="order in orders" ng-if="order.OrderStatus==2">
下面是我的下拉列表。
<div class="tab"> <input type="radio" id="tab-1" name="tab-group-1" checked> <label for="tab-1"> <select style="background: DarkSlateGrey; border-bottom: 2px; border-bottom-width: 4px; border-bottom-style: none; z-index: 2; text-align: center; position: absolute; top: 1px; left: 1px; Width: 98px; height: 25px; "> <option value="orders">Order</option> <option value="open">Open</option> <option value="complete">Completed</option> <option value="cancel">Cancelled</option> <option value="reject">Rejected</option> </select> </label>
如何将其与模态绑定，当我点击特定的订单元素时如何访问各个细节？
根据我的观点，你的prblm blw解决scheme将工作
在select标签中添加ng-model =“someVariable” ，以便当你select任何下拉值时，那么将被select， someVariable具有该值。使用该variables并访问其他东西。
对选项和ng-model使用ng-options属性可将search属性与选定的值绑定。 然后用筛选器按search值过滤订单，或者按照您的build议仅显示您需要的ng-if值。
<select ng-model="searchParams.OrderStatus" ng-options="status.value as status.os for status in orderStatus"></select>
现在$scope.searchParams.OrderStatus包含选定的订单状态。 在ng-repeat使用它
<tr ng-repeat="order in orders | filter: searchParams">
为了获得angularJs的力量，你必须使用允许two-way binding的model 。
这是你的问题的解决scheme。
这将是主要的变化。
<select ng-model="selected"> <option ng-repeat="option in orderStatus" value="{{option.value}}">{{option.os}}</option> </select>
1）在上面的代码中，我将ng-model="selected"赋值给保存选定值的select框。
2）我重复ng-options从你的对象，所以价值将是dynamic的。
<ul> <li ng-repeat="x in orders | filter : selected"> {{ x.Name }} </li> </ul>
3）我重复了这些orders并使用选定的值使用angular filter 。 以便订单将根据该值进行过滤
<!DOCTYPE html> <html> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> <body> <div ng-app="myApp" ng-controller="namesCtrl"> <div class="tab"> <input type="radio" id="tab-1" name="tab-group-1" checked> <label for="tab-1"> <select style=" border-bottom: 2px; border-bottom-width: 4px; border-bottom-style: none; z-index: 2; text-align: center; position: absolute; top: 1px; left: 1px; Width: 98px; height: 25px; " ng-model="selected"> <option value="">ALL</option> <option ng-repeat="option in orderStatus" value="{{option.value}}">{{option.os}}</option> </select> </label> </div> {{selected}} <ul> <li ng-repeat="x in orders | filter : selected"> {{ x.Name }} </li> </ul> <p>All these Order have OrderStatus. {{selected}}</p> </div> <script> angular.module('myApp', []).controller('namesCtrl', function($scope) { $scope.orderStatus = [ { os: 'Open', value: 1 },{ os: 'Completed', value: 2 },{os:'Cancelled',value: 3 }, { os: 'Rejected', value: 4 } ] $scope.orders = [ { OrderStatus: 2 , Name: 'order1'}, { OrderStatus: 3 , Name: 'order2'}, { OrderStatus: 3, Name: 'order3'}, { OrderStatus: 1 , Name: 'order4'}, { OrderStatus: 2 , Name: 'order5'}, { OrderStatus: 4 , Name: 'order6'}, { OrderStatus: 2 , Name: 'order7'} ]; }); </script> </body> </html>
- 量angular器JS预处理器
- debuggingprotactor（有/没有webstorm）
- 我可以根据mongoDB中的填充条件来查找文档吗？
- 使用SheetJS / js-xlsx进行Excel数据提取及其在AngularJS中的使用
- 模块没有在业力中定义
- 无法在Node.js res.body中获取$ http.post请求数据
- AngularJS SPA使用API和Mongoose
- AngularJS ngResource删除事件不调用callback
- 什么是创buildFirebasepipe理界面的正确方法？ 如何在AngularJS应用程序中使用Firebase以pipe理员帐户login？