Type error is not a function AngularJS

Question

I would like to populate a select with an array in AngularJS. I have an error : TypeError: meanService.getMeanStuff is not a function but I don't find where is the problem...

This is my view :

<div id="idName" ng-controller="controllerName">
    Here is my select :
    <select ng-model='modelTypeSelect' ng-options="n for n in meanStuff track by n"></select>
</div>

Controller :

d3DemoApp.controller('controllerName',function($rootScope,$scope, meanService) {
    $scope.meanStuff = meanService.getMeanStuff();
    $scope.$watch('modelTypeSelect',function(newVal){
        $rootScope.$broadcast(':parameterName',{choice:newVal});
    });
});

Service :

d3DemoApp.service('meanService', function() {
    this.getMeanStuff = function() {
        return (["data1", "data2", "data3"])
    };
}).service('dataService', function AppCtrl($http, $q) {
    this.getCommitData = function(param) {
        var deferred = $q.defer();
        $http({
            method: 'GET',
            url: param
        }).
        success(function(data) {
            deferred.resolve({
                chartData: data,
                error: ''
            });
        }).
        error(function(data, status) {
            deferred.resolve({
                error: status
            });
        });
        return deferred.promise;
    };

});

Thanks.

in your plunker order of js files included incorrectly.

Hadi
– Hadi

2016-05-16 07:52:53 +00:00
Commented May 16, 2016 at 7:52 — Hadi
– Hadi, Commented May 16, 2016 at 7:52

jcubic · Accepted Answer · 2016-05-16 07:54:59Z

1

You have wrong order of scripts first you need to include angular then create the module then include your controllers that use d3DemoApp module:

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.15/angular.min.js"></script>
<script>
  var d3DemoApp = angular.module('d3DemoApp', []); 
</script>
<script src="ControllerFilterListType.js"></script>
<script src="ServiceFilterListType.js"></script>

https://plnkr.co/edit/bm8UOrT1mjJyJguAXUUy?p=preview

answered May 16, 2016 at 7:54

jcubic

67.1k58 gold badges252 silver badges466 bronze badges

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

2 Comments

Anonymous Over a year ago

Thanks for your response, It works on Plunker but on my project, I have an error on $scope.meanStuff = meanService.getMeanStuff();, it says that angular.js:9563 TypeError: meanService.getMeanStuff is not a function. would you know where the problem might be? I'm going crazy ...

jcubic Over a year ago

Try recreate the problem in plunker.

Mark · Accepted Answer · 2016-05-16 07:36:15Z

0

Removed the brackets around the return. So:

return ["data1", "data2", "data3"]

answered May 16, 2016 at 7:36

Mark

5,17820 gold badges67 silver badges128 bronze badges

2 Comments

Anonymous Over a year ago

Hello, I have the same problem.

jcubic Over a year ago

You don't need to remove the brackets (1) === 1

Collectives™ on Stack Overflow

Type error is not a function AngularJS

2 Answers 2

2 Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related