【问题标题】:Angularjs filter exact numberAngularjs过滤确切数字
【发布时间】:2015-06-11 11:18:21
【问题描述】:

我有一个表格,显示州和县的下拉选择框,一切正常,除非我选择一个带有单个数字的州,比如数字“1”,过滤器将包括其他也有数字的州其中的“1”。我需要准确过滤或“真实”过滤,但不确定代码应该如何查找,我仍在学习 Angular。

这是我的 Javascript:

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

app.controller('myController', function($scope) {
  $scope.projects = [{
name: 'First thing',
state: 'CA',
stateID: '1',
county: 'Orange',
countyID: '191'
}, {
name: 'Another Thing',
state: 'CA',
stateID: '1',
county: 'LosAngeles',
countyID: '190'
}, {
name: 'In California',
state: 'CA',
stateID: '1',
county: 'Orange',
countyID: '191'
}, {
name: 'Hey Arizona!',
state: 'Arizona',
stateID: '13',
county: 'Multiple Counties',
countyID: '3178'
},{
name: 'hello Utah',
state: 'Utah',
stateID: '14',
county: 'Utah County',
countyID: '200'
}];

$scope.st_option = [{
state: "California",
stateID: "1"
}, {
state: "Arizona",
stateID: "13"
},{
state: "Utah",
stateID: "14"
}];

$scope.co_option = [{
county: "Orange",
countyID: "191",
co_state_id: "1"
}, {
county: "Multiple Counties",
countyID: "3178",
co_state_id: "13"
}, {
county: "Sonoma",
countyID: "218",
co_state_id: "1"
}, {
county: "Los Angeles",
countyID: "190",
co_state_id: "1"
}, {
county: "Utah County",
countyID: "200",
co_state_id: "14"
}];

$scope.filter = {};
$scope.clearFilter = function() {
$scope.filter = {};
};
});

还有观点:

<div ng-app='app' ng-controller='myController'>
<h3>Records: {{(projects|filter:filter).length}} of {{projects.length}}</h3>
<p><input type="text" name="generalSearch" placeholder="Search Project Title" ng-model="filter.name"></p>
<p><select ng-model="filter.stateID" 
      ng-options="item.stateID as item.state for item in st_option"></select>
<select ng-model="filter.countyID" 
      ng-options="item.countyID as item.county for item in co_option | filter:{ co_state_id : filter.stateID }">
  </select></p>

<p><a href="" id="clear-filter" ng-click="clearFilter()">Reset Filters</a></p>

<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>

还有一个小提琴:

https://jsfiddle.net/webmastersean/4m2d5n8u/

【问题讨论】:

    标签: angularjs angularjs-ng-repeat angular-filters


    【解决方案1】:

    filter的最后一个参数设置为true,见comparator parameter

    <div ng-repeat="project in projects | filter:filter:true">
    

    编辑以允许多个过滤器:

    <input type="text" name="generalSearch" placeholder="Search Project Title" ng-model="filter2.name">
    
    <div ng-repeat="project in projects | filter:filter:true | filter:filter2">
    

    【讨论】:

    • 是的,我认为这也是答案,但它破坏了一般搜索,因为用户无法开始输入字符串来过滤结果......所以我想我应该在我的问题中更具体 - 我需要完全按状态过滤,但不完全按第一个搜索字段。
    • 添加另一个过滤器或编写自定义过滤器功能。我将修改我的答案,以便您可以同时过滤。
    猜你喜欢
    • 1970-01-01
    • 2021-09-18
    • 1970-01-01
    • 1970-01-01
    • 2014-11-25
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多