Восстановить стоимость от JSON, используя сервис в AngularJS?

Question

Я новичок в AngularJS. Я пытаюсь извлечь данные из JSON с помощью сервиса и отобразить его. У меня есть отдельные файлы для контроллеров, служб. Я не могу узнать, что я делаю неправильно здесь. Я узнал, что мы возвращаем объект в случае фабрики, но я не уверен, как вернуть значение при использовании сервисов. Код, который я пробовал, приведен ниже.

HTML: У меня есть index.html файл, в который я загрузить этот HTML:

<div ng-controller="comp"> 
    {{capcino}} 
</div> 

Контроллер:

var app = angular.module("retailapp"); 

app.controller("comp", function($scope, elecservice){ 
    $scope.capcino = elecservice.getval(); 
}); 

Услуги:

angular.module("retailapp").service("elecservice", serjson); 

function serjson($http){ 
    var val = ""; 

    this.getval = function(){ 
     $http.get("/elec.json").success(function(res){ 
      val = res.namet; 
      return val; 
     }); 
    } 
} 

Routing:

var app = angular.module("retailapp", ['ngRoute']); 

app.config(function($routeProvider){ 
    $routeProvider.when("/computer", { 
     templateUrl : "computer.html", 
     controller : "comp" 
}); 

JSON:

{"namet" : "naysan"} 

Я хочу, чтобы отобразить значение "capcino" в выражении в HTML. Я получаю undefined за это значение. Пожалуйста, помогите с объяснением. Заранее спасибо.

Answer 1

Написать следующим образом:

var app = angular.module("retailapp"); 

    app.controller("comp", function($scope, elecservice){ 

     elecservice.getval().then(function(data){ 
     $scope.capcino = data; 
    });  

    }); 

Answer 2

Это обещание так оно устанавливает $ scope.capcino после того, как возвращается. До тех пор, пока это не произойдет, значение $ scope.capcino не определено.

var app = angular.module("retailapp"); 
    app.controller("comp", function($scope, elecservice){ 
     elecservice.getval().then(function(data){ 
     $scope.capcino = data; 
    });  
}); 

Answer 3

Просто смените контроллер, чтобы сохранить данные.

$scope.yourFunc = function(params){ 
    YouService.function(params).then(function(result){ 
     $scope.yourVar = result.data; 
    } 
    }) 

}}