Angular Underscore Cannot read property 'find' of undefined

Question

I'm trying to return the object with a specific "ID" from the json service. I can see the objects in my console log but any attempt to iterate or use underscore _find gives me "undefined"

var metaresult = _.find($scope.results.results, function(rw){ return rw.id == $scope.answer1 });

gives me this error:

TypeError: Cannot read property 'find' of undefined
at k.$scope.metaResult (https://evening-taiga-2443.herokuapp.com/js/controllers/MainController.js:173:21)

Here is my factory:

 app.factory('results', ['$http', function($http) { 
  return $http.get('js/services/results.json') 
.success(function(data) { 
  return data; 
}) 
.error(function(err) { 
  return err; 
});

}]);

any my json structure:

{
"results": [
    {
        "id": "a" 
    },
              .... and so on

EDIT: So the issue seems to be dependency. I tried using ng-underscore instead and I'm loading as follows:

<script src="js/ng-underscore.min.js"></script>

then the app.js

var app = angular.module("quizApp", ['720kb.socialshare', 'ngUnderscore']);

Then in my controller

app.controller('MainController', ['$scope', 'quiz', 'results', function($scope, quiz, results, underscore)

typing "underscore" into console gives me:

Uncaught ReferenceError: underscore is not defined

EDIT: Figured it out just need to use lodash

- Did you checked underscore library is already included in scripts? - Did you injected underscore library in the controller dependencies? - Are you using require? index.html and the controller could be helpful to solve the issue — Matias Beckerle, Jul 17 '15 at 18:41
this is not the issue with the data, but it is that browser is unable to find _, try writing _ in console and you will get error, and then try $ as (if you have jquery added) and you get the object returned. — Haseeb Asif, Jul 17 '15 at 19:34

score 1 · Answer 1 · answered Jul 17 '15 at 19:42

1

var metaresult = _.find( ...

TypeError: Cannot read property 'find' of undefined

This error means that javascript didn't know what is _. _ is undefined and when you do _.find then error is generated. It seems you're not loading libraries properly. Kindly make sure you have added the underscore js module. Once underscore is loaded, _ will reference to the js module and you will be able to use all the methods.

answered Jul 17 '15 at 19:42

Haseeb Asif

1,766
2
23
41

I tried using NG Underscore instead, im loading the script like so: , my app has it loaded as so: var app = angular.module("quizApp", ['720kb.socialshare', 'ngUnderscore']); and my controller calls it as so: app.controller('MainController', ['$scope', 'quiz', 'results', function($scope, quiz, results, underscore) and lastly I'm using underscore as so: underscore.find( ... ). Same error. – Kevin Compton Jul 17 '15 at 20:49

score 0 · Answer 2 · edited May 23 '17 at 12:29

0

_ would be referring to either lodash or underscore which are both javascript utility libraries. I would suggest that you take a look at bower which is a package manager for front end libraries and make sure that you both have the necessary files in your project and also that they are being referenced in your HTML.

I would personally recommend that you use lodash instead of underscore as it is essentially a drop in replacement and offers performance benefits. That being said, there is absolutely no reason to use an angular module wrapper in based on the code that you've shown here. Simply downloading lodash and including it in your HTML will make it available for use inside your controller without having to worry about any module dependencies or controller injection.

edited May 23 '17 at 12:29

Community

1
1

answered Jul 17 '15 at 19:53

Jesse Carter

20,062
7
64
101

@KevinCompton Updated my answer, I would highly recommend that you don't use angular underscore. It is not maintained and lodash offers performance improvements. – Jesse Carter Jul 17 '15 at 21:19
my apologies, I just googled angular underscore and assumed that you were using that one – Jesse Carter Jul 17 '15 at 22:36
Thanks for the apology but if you were the one that downvoted my question I would appreciate reversing that as well thanks – Kevin Compton Jul 17 '15 at 23:48

score 0 · Answer 3 · answered Jul 17 '15 at 20:47

0

Once get the libs to load correctly, it should be:

var metaresult = _.findWhere($scope.results.results, { id: $scope.answer1.id });

http://underscorejs.org/#findWhere

answered Jul 17 '15 at 20:47

jakeforaker

1,622
1
20
34

Angular Underscore Cannot read property 'find' of undefined

3 Answers3