Angularjs - Can not load service returned value to $scope

Question

I'm using angularjs and I am trying to parse a value from a service to my $scope controller. The problem is that is loading first the $scope and then the service. As a result me my scope is always undefinied. I tried many solutions that I found by no-one is worked for me. Can anyone help me please? My service:

'use strict';
angular.module('myApp')
    .service('getCategoriesService', function ($rootScope) {

        getCategories = function () {
            var categoriesByLocation = 1;      
            return categoriesByLocation;
        };

and my controller:

angular.module("myApp")
  .controller('MyCtrl', function ($scope,getCategoriesService) {
         $scope.resultCategory = getCategoriesService.getCategories();
         });

Sachila Ranawaka · Accepted Answer · 2018-01-26 08:07:05Z

1

Use the this. when declaring a function in a service.

.service('getCategoriesService', function ($rootScope) {

        this.getCategories = function () {
            var categoriesByLocation = 1;      
            return categoriesByLocation;
        };

  })

demo

var app = angular.module("myApp",[]);
app.controller('MyCtrl', function ($scope,getCategoriesService) {
         $scope.resultCategory = getCategoriesService.getCategories();
 });
 app.service('getCategoriesService', function ($rootScope) {
    
        this.getCategories = function () {
            var categoriesByLocation = 1;      
            return categoriesByLocation;
        };
        
  })

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp" ng-controller="MyCtrl">
  {{resultCategory}}
</div>

answered Jan 26, 2018 at 8:07

Sachila Ranawaka

41.6k8 gold badges62 silver badges87 bronze badges

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

2 Comments

Celia Over a year ago

Thank you for your answer, I have always the same problem, the $scope is loading before the service.

Sylvan LE DEUNFF Over a year ago

It's definitely the answer. I agree with you

Sajeetharan · Accepted Answer · 2018-01-26 08:03:24Z

0

Change it as

angular.module("myApp")
  .controller('MyCtrl', function ($scope,getCategoriesService) {
        getCategoriesService.getCategories().then((function (d) {
         $scope.resultCategory = d; 
     }
 });

answered Jan 26, 2018 at 8:03

Sajeetharan

223k65 gold badges370 silver badges409 bronze badges

1 Comment

Celia Over a year ago

Thank you for your answer, I have always the same problem, the $scope is loading before the service.

Collectives™ on Stack Overflow

Angularjs - Can not load service returned value to $scope

2 Answers 2

2 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related