Get a specific object from an object array in angular

Question

This is my object array and it is bound to a dropdownlist:

$scope.dropdownOptions = [{value: "0", name: 'No'}, {value: "1", name: 'Yes'}];

I want to return the corresponding "Name" depending on the selected "Value" in the dropdown through the following function. Right now I have hardcoded the return values.

$scope.getDropdownDisplayValue = function(_key){
    if(_key == "1")
      return "Yes";
    else if(_key == "0")
      return "No";
    else
      return "n/a";
  };

The problem is, if I modify the Names property of objects in that array I will have to come and change the return values of the above function as well. To Avoid that, I want to serach the object array and return the corresponding value. For example:

$scope.getDropdownDisplayValue = function(_key){
        if(_key == "1")
          return <get object.name where object.value == _key from dropdownOptions array>
        else if(_key == "0")
          return <get object.name where object.value == _key from dropdownOptions array>
        else
          return "n/a";
      };

I can write a custom function for that, but want to whether I can use something already available in AngularJS or JavaScript. Thanks in advance.

Andy Ecca · Accepted Answer · 2014-11-28 05:27:32Z

1

Yes, you can use filterFilter service.

For example

app.controller('ExampleCtrl', ['$scope','filterFilter', function($scope, filterFilter) 
{

   $scope.dropdownOptions = [{value: "0", name: 'No'}, {value: "1", name: 'Yes'}];

   $scope.getDropdownDisplayValue = function(_key) {
      var objs = filterFilter($scope.dropdownOptions , {value: _key});
      if( objs.lenght > 0) {
        return objs[0].name;
      } else {
        return 'n/a';
      }
   };

 }]);

Hope this help.

answered Nov 28, 2014 at 5:27

Andy Ecca

1,98914 silver badges14 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

JRulz Over a year ago

This worked for my problem perfectly. I did not know about filterFilter. Thank you very much.

huan feng · Accepted Answer · 2014-11-28 05:22:11Z

Is this you wanted?

fiddle

angular.module('demoApp', []).controller('DemoController', function($scope) {

  $scope.options = [
    { label: 'one', value: 1 },
    { label: 'two', value: 2 }
  ];

  // Although this object has the same properties as the one in $scope.options,
  // Angular considers them different because it compares based on reference
  $scope.incorrectlySelected = { label: 'two', value: 2 };

  // Here we are referencing the same object, so Angular inits the select box correctly
  $scope.correctlySelected = $scope.options[1];
});

index.html:

<select ng-model="incorrectlySelected"
            ng-options="opt as opt.label for opt in options">
        </select>

above is example from the angularJS official website

Thank you very much for the answer. Here we are straightaway using the selected value from but my scenario was different. I wanted to get the value from dropdown and then later on refer to the object array and get the corresponding name from the same.

Collectives™ on Stack Overflow

Get a specific object from an object array in angular

2 Answers 2

1 Comment

1 Comment

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

1 Comment

Related