Search array for specific string and return the value to AngularJS view

Question

In the code below, I'm trying to search the JSON output for a specific string (for example 'name_col_lbl') and return its value (in this case 'Name') for AngularJS to ouptut in the view.

$scope.globalContent = [
    {"id":"1","module":"student_reg","item":"name_col_lbl","value":"Name"},
    {"id":"2","module":"student_reg","item":"bday_col_lbl","value":"Birthdate"}
]
angular.forEach($scope.globalContent, function(el){
    $scope.nameLbl = el ***This is where I need to search for the string and return its value***;
    $scope.bdayLbl= el ***This is where I need to search for the string and return its value***;

});

I can't seem to find an efficient way to handle this. Thanks in advance!

score 0 · Accepted Answer · answered May 11 '17 at 00:05

0

This should do the trick:

var $scopeglobalContent = [
    {"id":"1","module":"student_reg","item":"name_col_lbl","value":"Name"},
    {"id":"2","module":"student_reg","item":"bday_col_lbl","value":"Birthdate"}
];

for(var i = 0; i < $scopeglobalContent.length; i++){
 for(key in $scopeglobalContent[i]){
   if($scopeglobalContent[i][key] == "name_col_lbl"){
     return console.log($scopeglobalContent[i].value);
    }
  }
}

This is basic stuff. I suggest you read on objects and loops to get a better understanding of how this works and how to use it.

answered May 11 '17 at 00:05

JJJ

3,314
4
29
43

Thank you. I'm self-taught and indeed missing some very basic knowledge. I appreciate every learning opportunity. – spookybot May 11 '17 at 00:10
@spookybot I'm self-taught too and the way I learned was by reading and writing more code and trying out different concepts and techniques. – JJJ May 11 '17 at 00:11
Also, for clarity to anyone who comes across this post, it should $scope.globalContent in your code. with AngularJS you need the period after $scope. – spookybot May 11 '17 at 00:11
@spookybot I removed the `$scope.` because I ran it in jsfiddle – JJJ May 11 '17 at 00:12
1

Cool I appreciate the guidance. Reading more about objects and loops now. – spookybot May 11 '17 at 00:18

score 0 · Answer 2 · edited May 23 '17 at 11:54

0

From this stackoverflow answer, here's how you can search an array of objects:

var obj = array.filter(function ( obj ) {
    return obj.item === "name_col_lbl";
});

obj will contain either the value of name_col_lbl or undefined if the key doesn't exist.

So your code would look like this:

function findObject(array, keyName) {
    var obj = array.filter(function ( obj ) {
        return obj.item === keyName;
    })[0];
    return obj;
}

$scope.globalContent = [
    {"id":"1","module":"student_reg","item":"name_col_lbl","value":"Name"},
    {"id":"2","module":"student_reg","item":"bday_col_lbl","value":"Birthdate"}
]
angular.forEach($scope.globalContent, function(el){
    $scope.nameLbl = findObject($scope.globalContent, "name_col_lbl")['value]' ***This is where I need to search for the string and return its value***;
    $scope.bdayLbl= findObject($scope.globalContent, "bday_col_lbl")['value]' ***This is where I need to search for the string and return its value***;
});

The findObject function filters the array by returning the first object that it finds where obj.item matches whatever is contained in keyName. This is the obj object which gets returned. Since you don't want the whole object but just a value of that object, I've taken the result of the findObject($scope.globalContent, "name_col_lbl") and added ['value'] which will return just the value key which is what you want to display in the Angular view.

edited May 23 '17 at 11:54

Community

1
1

answered May 11 '17 at 00:11

Dr. Cool

3,713
3
22
26

I like your approach Dr. Cool Do you feel this is a more efficient and/or a cleaner way to approach this compared to @Josan_Iracheta answer? – spookybot May 11 '17 at 00:14
Actually I'm not sure this accomplishes my goal. This doesn't return the value of the "value" string associated with the object that matches the string. – spookybot May 11 '17 at 00:17
I updated the code to pull the "value" string as you needed... try it now. Also, I like Josan's answer. I think both of these are good, and they're a great way for you to see two different ways to accomplish the same thing. As for performance, I'm not sure which is faster but you're not searching a huge amount of data (I assume) so I think you'll be fine with either method. – Dr. Cool May 11 '17 at 00:19
Thank you very much Dr. Cool -- this is a great learning opportunity for me. – spookybot May 11 '17 at 00:23
@Dr.Cool your code will not work in this example because `array` has to be `$scope.globalContent`. Secondly, you're only searching the first object in the array. It would be better if the function would search the array without you having to explicitly declare an index to search in, which is what my code does. – JJJ May 11 '17 at 00:25
I just noticed the problem with `array` which I just fixed. And thanks for pointing out that it's only searching the first element in the array. I fixed that too. – Dr. Cool May 11 '17 at 00:27
@Dr.Cool Also, `array.filter()` returns an array so in this case, I think it would be more suitable to return a string instead. – JJJ May 11 '17 at 00:30
I added back in the `[0]` because I realized that it will cause it to return the first value of the array. The `filter` function will return an array where any array items match the test in the function. If more than one item matches, we don't want duplicates so I grab only the first one with [0]. Now it's not returning an array, but an object. – Dr. Cool May 11 '17 at 00:33

Search array for specific string and return the value to AngularJS view

2 Answers2