javascript - AngularJS search array of objects -

i have array of objects in controller eg:

$scope.fields = [     {fieldname:'housenum',fieldlabel:'house number',disabled:false},     {fieldname:'street',fieldlabel:'street',disabled:false},     {fieldname:'city',fieldlabel:'city',disabled:true},     {fieldname:'state',fieldlabel:'state',disabled:true}, ] 

in html able fieldlabel fieldname=='street'. ajs documentation presumes every filter case should in context of ng-repeat - not in case trying pluck 1 'fieldlabel' 'fields' array based on 'fieldname'

eg: html

{{ fieldlabel in fields | filter : {fieldname:'street'} : true}} 

how can make work - or need create own directive , pass $scope.fields directive , loop through manually?

you do:

{{ (fields | filter : {fieldname:"street"} : true)[0].fieldlabel}} 

(fields | filter : {fieldname:"street"} : true) returns array of filtered items first 1 [0] , access fieldlabel property out of object.

angular.module('app', []).controller('ctrl', function($scope) {    $scope.fields = [{      fieldname: 'housenum',      fieldlabel: 'house number',      disabled: false    }, {      fieldname: 'street',      fieldlabel: 'street',      disabled: false    }, {      fieldname: 'city',      fieldlabel: 'city',      disabled: true    }, {      fieldname: 'state',      fieldlabel: 'state',      disabled: true    }, ]  })

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>  <div ng-app="app" ng-controller="ctrl">    {{ (fields | filter : {fieldname:"street"} : true)[0].fieldlabel}}  </div>

though better option set property controller itself, filter not run during every digest cycle.

function getfieldbyname(prop){      var field = {};      //or use loop , break once find match      $scope.fields.some(function(itm){          if(itm.fieldname === prop){             field = itm;             return true;          }      });      //or inject $filter below      //return $filter('filter')($scope.fields,{fieldname:"street"})[0] || {}      return field; }  //somewhere $scope.streetfield = getfieldbyname('street'); 

in view:

{{streetfield.fieldlabel}} 

array.some