0

I'm trying to filter a selection list:

<div ng-controller="Ctrl">
<select ng-model="targetToMap" required="true" 
ng-options="code.instructions_short for code in targetCodes   |filter:targetCodes.environment=2"
    ></select>
<div>
var app = angular.module('app', []);

function Ctrl($scope) {  
$scope.targetCodes = [
{"fid":"1","environment":"1","instructions_short":"Script1.1"},
{"fid":"2","environment":"1","instructions_short":"Script1.2"},
{"fid":"3","environment":"1","instructions_short":"Script1.3"},
{"fid":"4","environment":"1","instructions_short":"Script1.4"},
{"fid":"5","environment":"2","instructions_short":"Script2.1"},
{"fid":"6","environment":"2","instructions_short":"Script2.2"},
{"fid":"7","environment":"2","instructions_short":"Script2.3"},
{"fid":"8","environment":"2","instructions_short":"Script2.4"}
];
}

For some reason the filter appears to applying to both FID and ENVIRONMENT, so it returns a list including fid=2 as well as the 4 records where environment=2. I put the filter inline to simplify the code. What's wrong with this picture?

A jsfiddle can be found here: jsfiddle

4

3 回答 3

2

Looks to me like you are using the wrong syntax for filter.

Try replacing your filter with

| filter: {environment: '2'}

This will look for only objects in your array that have the property environment set to 2. Currently I don't know why it is doing what it's doing, but targetCodes doesn't have the environment property so the filter doesn't seem to make a lot of sense in general, even if it was using correct syntax.

Edit

Quick experiment shows that filtering on the original

targetCodes.environment=2

actually sets targetCodes.environment to 2, and also evaluates to 2. So this was equivalent to filtering with

| filter: 2
于 2013-11-03T16:17:22.243 回答
0

To filter properties, you should use:

filter: { name: 'val'}

You can see it in the first comment on the filter docs (Yes, its not necessarily "documented")

So, in your code, should be:

<select ng-model="targetToMap" required="true" ng-options="code.instructions_short for code in targetCodes | filter: {environment:  '2'}">

Fiddle

于 2013-11-03T16:17:30.613 回答
0

You can also try something like this:

HTML:

  <div ng-controller="Ctrl">
    <select ng-model="targetToMap" required="true" ng-options="code.instructions_short for code in targetCodes">
      <option value="">-- Select Instructions --</option>
    </select>
  </div>

JavaScript:

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

function Ctrl($scope) {

  var allTargetCodes =[
      {"fid":"1","environment":"1","instructions_short":"Script1.1"},
      {"fid":"2","environment":"1","instructions_short":"Script1.2"},
      {"fid":"3","environment":"1","instructions_short":"Script1.3"},
      {"fid":"4","environment":"1","instructions_short":"Script1.4"},
      {"fid":"5","environment":"2","instructions_short":"Script2.1"},
      {"fid":"6","environment":"2","instructions_short":"Script2.2"},
      {"fid":"7","environment":"2","instructions_short":"Script2.3"},
      {"fid":"8","environment":"2","instructions_short":"Script2.4"}
  ];

  function filterTargetCodes() {
    $scope.targetCodes = [];
    angular.forEach(allTargetCodes, function(row) {
      if (row.environment != "2") {
        return;
      }
      $scope.targetCodes.push(row);
    });
  };

  filterTargetCodes();
}

Example

于 2013-11-03T16:33:03.233 回答