Angular filter on json object

Question

I have a json record as country, inside country, it contains many states, I want to filter by either label or value, so the states json looks like:

$scope.states: {"s1":{"label":"Alabama","value":"Alabama"},"s2":{"label":"Alaska","value":"Alaska"},"s3":{"label":"Arizona","value":"Arizona"},"s4":{"label":"Arkansas","value":"Arkansas"},"s5":{"label":"California","value":"California"},"s6":{"label":"Colorado","value":"Colorado"},"s7":{"label":"Connecticut","value":"Connecticut"},"s8":{"label":"Delaware","value":"Delaware"},"s9":{"label":"DC","value":"DC"},"s10":{"label":"Florida","value":"Florida"},"s11":{"label":"Georgia","value":"Georgia"},"s12":{"label":"Hawaii","value":"Hawaii"},"s13":{"label":"Idaho","value":"Idaho"},"s14":{"label":"Illinois","value":"Illinois"},"s15":{"label":"Indiana","value":"Indiana"},"s16":{"label":"Iowa","value":"Iowa"},"s17":{"label":"Kansas","value":"Kansas"},"s18":{"label":"Kentucky","value":"Kentucky"},"s19":{"label":"Louisiana","value":"Louisiana"},"s20":{"label":"Maine","value":"Maine"},"s21":{"label":"Maryland","value":"Maryland"},"s22":{"label":"Massachusetts","value":"Massachusetts"},"s23":{"label":"Michigan","value":"Michigan"},"s24":{"label":"Minnesota","value":"Minnesota"},"s25":{"label":"Mississippi","value":"Mississippi"},"s26":{"label":"Missouri","value":"Missouri"},"s27":{"label":"Montana","value":"Montana"},"s28":{"label":"Nebraska","value":"Nebraska"},"s29":{"label":"Nevada","value":"Nevada"},"s30":{"label":"New Hamshire","value":"New Hamshire"},"s31":{"label":"New Jersey","value":"New Jersey"},"s32":{"label":"New Mexico","value":"New Mexico"},"s33":{"label":"New York","value":"New York"},"s34":{"label":"North Carolina","value":"North Carolina"},"s35":{"label":"North Dakota","value":"North Dakota"},"s36":{"label":"Ohio","value":"Ohio"},"s37":{"label":"Oklahoma","value":"Oklahoma"},"s38":{"label":"Oregon","value":"Oregon"},"s39":{"label":"Pennsylvania","value":"Pennsylvania"},"s40":{"label":"Puerto Rico","value":"Puerto Rico"},"s41":{"label":"Rhode Island","value":"Rhode Island"},"s42":{"label":"South Carolina","value":"South Carolina"},"s43":{"label":"South Dakota","value":"South Dakota"},"s44":{"label":"Tennessee","value":"Tennessee"},"s45":{"label":"Texas","value":"Texas"},"s46":{"label":"Utah","value":"Utah"},"s47":{"label":"Vermont","value":"Vermont"},"s48":{"label":"Virgin Islands","value":"Virgin Islands"},"s49":{"label":"Virginia","value":"Virginia"},"s50":{"label":"Washington","value":"Washington"},"s51":{"label":"West Virginia","value":"West Virginia"},"s52":{"label":"Wisconsin","value":"Wisconsin"},"s53":{"label":"Wyoming","value":"Wyoming"}}

the code for the page is:

<label class="item item-input">
            <input type="text" placeholder="请输入你要寻找的省市" ng-model="searchText.$"/>
        </label>
        <ion-radio ng-model="create.state" ng-repeat="s in states | filter:searchText)" ng-value="s">{{s.label}}</ion-radio>

this does not work, I also tried custom filter based on another post: filter on nested objects, does not work for me

Answer 1

mention which field are you trying to put a filter on

filter:{'label': searchText} and ng-model="searchText" would suffice.

As you are trying to iterate over the object properties you can define a custom filter as follows .Here is the working example

 .filter('customFil', function () {

return function (p, query) {
    var obj = {};

    for (var key in p) {
        if (p.hasOwnProperty(key)) {

            if (p[key].label.includes(query)) {

                obj[key] = p[key];
            }
        }
    }
    return obj;
}
});