2016-07-14 8 views
3

オブジェクトが&ではなく、角度が1.5.6のnullである項目を除外しようとしています。Select ng-optionsのオブジェクトでAngularjsフィルタがnullでない:

これよりすべてのオプションを試しました。post

まだ動作させることはできません。

のみ 'サリー' はここでselect

に示すべきであるfiddle

HTMLです:

<div ng-app="myApp" ng-controller="myCtrl"> 
    <br> 

    <select ng-model="a" ng-options="detail.name for detail in details | filter:{shortDescription:'!null'} track by detail.name"> 
    </select> 

    <br> 
    New 

    <select ng-model="b" ng-options="detail.name for detail in details | filter:{shortDescription: ''} track by detail.name"> 
    </select> 

    <br> 
    All 
    <select ng-model="c" ng-options="detail.name for detail in details | filter:{shortDescription: '!!'} track by detail.name"> 
    </select> 

    <br> 
    Without any filter 
    <select ng-model="d" ng-options="detail.name for detail in details track by detail.name"> 
    </select> 
    <!-- --> 
</div> 

スクリプト:

function myCtrl($scope) { 
    $scope.details = [{ 
     name: 'Bill', 
     shortDescription: null 
    }, { 
     name: 'Sally', 
     shortDescription: {'MyName':'A girl'} 
    }]; 
} 

angular.module("myApp",[]).controller("myCtrl", myCtrl); 

答えて

2

問題は、あなたのケースでfilter:{shortDescription: ''}試合唯一のプリミティブではなく、複雑なオブジェクトとshortDescriptionがAであるということですネストされたオブジェクト。
はそのため代わりにそのようfilter:{shortDescription:{$:''}}を使用します。

<select ng-model="a" 
      ng-options="detail.name for detail in details | filter:{shortDescription:{$:''}} track by detail.name"> 
    </select> 
2

nullでないチェックが機能しないために知っているこのスニペットにngOptionsであなたの目標を達成するために

function myCtrl($scope) { 
 
    $scope.details = [{ 
 
     name: 'Bill', 
 
     shortDescription: null 
 
    }, { 
 
     name: 'Sally', 
 
     shortDescription: {'MyName':'A girl'} 
 
    }]; 
 

 
} 
 

 
angular.module("myApp",[]).controller("myCtrl", myCtrl).filter('descFilter',descFilter); 
 

 
function descFilter(){ 
 
\t return function(array,key){ 
 
    \t var newArr = []; 
 
    for(var i = 0; i < array.length; i++){ 
 
    \t if (array[i][key] != null){ 
 
     newArr.push(array[i]); 
 
     } 
 
    } 
 
    return newArr; 
 
    }; 
 
}
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script> 
 
<div ng-app="myApp" ng-controller="myCtrl"> 
 
    <br> 
 
    With Filter: 
 
    <select ng-model="a" ng-options="detail.name for detail in details | descFilter:'shortDescription'"> 
 
    </select> 
 
    
 
    
 
    <br> 
 
    Without any filter 
 
    <select ng-model="d" ng-options="detail.name for detail in details track by detail.name"> 
 
    </select> 
 
    <!-- --> 
 
</div>

+0

有効なフィルターではありませんありがとうございました。あなたの答えは本当にうまくいきます。しかし、それは新しい配列を別のフィルター関数の中に作成することを意味します。私はDAXholicが提供したもののような基本的なものを探していました。 –

1

を実行してください。代わりにカスタムフィルタを作成して使用することができます。

ここにカスタムフィルタ機能を使用した例を示します。 http://jsfiddle.net/ivankovachev/bue59Loj/

カスタムフィルタ機能:

$scope.isDescriptionNull = function(item) { 
      if (item.shortDescription === null) return false; 

      return true; 
     } 

とその使用方法:

<select ng-model="a" ng-options="detail.name for detail in (details | filter:isDescriptionNull) track by detail.name"> 
0

あなたのマークアップに少しバグがあります。

フィルタは、オブジェクトのプロパティ、式、またはコンパレータを取得する必要があります。

公式ドキュメント:

{{ filter_expression | filter : expression : comparator : anyPropertyKey}} 

だから、何をやっていることは

0
<select ng-model="a" 
      ng-options="detail.name for detail in details | filter:{shortDescription:'!!'}} track by detail.name"> 
    </select> 
関連する問題