Получение ошибки при передаче данных между контроллерами с использованием примерной службы

как часть изучения угловых js, я создал небольшое приложение, которое будет передавать данные между двумя контроллерами, используя сервисы. Ниже мой код передает данные между двумя контроллерами ..Получение ошибки при передаче данных между контроллерами с использованием примерной службы

код

контроллер

<!DOCTYPE html> 
<html lang="en-us" ng-app="myApp"> 
<head> 
<title></title> 
<script src="https://code.angularjs.org/1.5.8/angular.min.js"></script> 
<script type="text/javascript"> 
    var app = angular.module('myApp', []); 

app.service('sampleService', [function() { 
    this.user = [name = 'pra', empno ='1234'] 
    this.designation = 'teamlead'; 

}]) 
app.controller('NameCtrl', ['$scope','$sampleService', function ($scope,$sampleService) { 
$scope.empname = $sampleService.user.name; 
$scope.empnumber = $sampleService.user.empno; 
$scope.empdesignation = $sampleService.designation; 
$scope.changevals = function(){ 
    $sampleService.user.empno = '9876'; 
    $sampleService.designation = 'manager'; 
    $scope.empnumber = $sampleService.user.empno; 
    $scope.empdesignation = $sampleService.designation; } 
    }]) 

app.controller('NameCtrl1', ['$scope','$sampleService', function ($scope) { 
    $scope.uEmpiId = $sampleService.user.empno; 
    $scope.uempdesignation = $sampleService.designation; 
$scope.updatevals = function(){ 
    $scope.uEmpiId = $sampleService.user.empno; 
    $scope.uempdesignation = $sampleService.designation; } 
}]) 
</script> 
</head>

ниже код мой HTML код

<body> 
    <div ng-controller="NameCtrl"> 
<div><b> Details - Controller 1</b></div> 
<p>Name : {{empname}}</p> 
<p>Location : {{empnumber}}</p> 
<p>Designation : {{empdesignation}}</p> 
<input type="button" value="Change Values" ng-click="changevals()" /> 
</div> 
<br /> 
<div ng-controller="NameCtrl1"> 
<div><b>Details - Controller 2</b></div> 
<input type="button" value="Change Values" ng-click="updatevals()" /> 
<p>Location : {{uEmpiId}}</p> 
<p>Designation : {{uempdesignation}}</p> 
</div> 
</body>

Я не в состоянии отобразить детали и получаю сообщение об ошибке, как этот

angular.js: 13920 Ошибка: [$ Инжектор: unpr]? $ http://errors.angularjs.org/1.5.8/ инжектор/unpr = р0% 24sampleServiceProvider% 20% 3C-% 20% 24sampleService% 20% 3C-% 20NameCtrl при Error (родной)

Может ли одна просьба указать мне в правильном направлении, на котором я делаю неправильно с этим кодом ..

Большое спасибо заранее ....

источник

2016-07-28 Enigma State

не используйте «$» при нагнетании обслуживание в вашем контроллере:

изменение:

app.controller('NameCtrl', ['$scope','$sampleService', function ($scope,$sampleService) {

к:

app.controller('NameCtrl', ['$scope','sampleService', function ($scope,sampleService) {

EDIT

также (как @estus предложил), ваша служба не определена в NameCtrl1

код изменения лет Ур NameCtrl2 от

app.controller('NameCtrl1', ['$scope','$sampleService', function ($scope) {

app.controller('NameCtrl1', ['$scope','sampleService', function ($scope, sampleService) {

В вашем коде, всякий раз, когда вы используете этот sampleService, не использовать sampleService вместо $sampleService.

EDIT 2

изменить ваш

app.service('sampleService', [function() { 
    this.user = [name = 'pra', empno ='1234'] 
    this.designation = 'teamlead'; 
}])

app.service('sampleService', [function() { 
       this.user = {name : 'pra', empno : '1234'}; 
       this.designation = 'teamlead'; 
      }])

Окончательный код будет выглядеть следующим образом:

<!DOCTYPE html> 
 
<html lang="en-us" ng-app="myApp"> 
 

 
    <head> 
 
     <title></title> 
 
     <script src="https://code.angularjs.org/1.5.8/angular.min.js"></script> 
 
     <script type="text/javascript"> 
 
      var app = angular.module('myApp', []); 
 
    
 
      app.service('sampleService', [function() { 
 
       this.user = {name : 'pra', empno : '1234'}; 
 
       this.designation = 'teamlead'; 
 
    
 
      }]) 
 
      app.controller('NameCtrl', ['$scope', 'sampleService', function($scope, sampleService) { 
 
       $scope.empname = sampleService.user.name; 
 
       $scope.empnumber = sampleService.user.empno; 
 
       $scope.empdesignation = sampleService.designation; 
 
       $scope.changevals = function() { 
 
        sampleService.user.empno = '9876'; 
 
        sampleService.designation = 'manager'; 
 
        $scope.empnumber = sampleService.user.empno; 
 
        $scope.empdesignation = sampleService.designation; 
 
       } 
 
      }]) 
 
    
 
      app.controller('NameCtrl1', ['$scope', 'sampleService', function($scope, sampleService) { 
 
       $scope.uEmpiId = sampleService.user.empno; 
 
       $scope.uempdesignation = sampleService.designation; 
 
       $scope.updatevals = function() { 
 
        $scope.uEmpiId = sampleService.user.empno; 
 
        $scope.uempdesignation = sampleService.designation; 
 
       } 
 
      }]) 
 
     </script> 
 
    </head> 
 
    <body> 
 
     <div ng-controller="NameCtrl"> 
 
      <div><b> Details - Controller 1</b> 
 
      </div> 
 
      <p>Name : {{empname}}</p> 
 
      <p>Location : {{empnumber}}</p> 
 
      <p>Designation : {{empdesignation}}</p> 
 
      <input type="button" value="Change Values" ng-click="changevals()" /> 
 
     </div> 
 
     <br /> 
 
     <div ng-controller="NameCtrl1"> 
 
      <div><b>Details - Controller 2</b> 
 
      </div> 
 
      <input type="button" value="Change Values" ng-click="updatevals()" /> 
 
      <p>Location : {{uEmpiId}}</p> 
 
      <p>Designation : {{uempdesignation}}</p> 
 
     </div> 
 
    </body> 
 
</html>

источник

2016-07-28 12:08:11

Кроме того, это 'undefined' в NameCtrl1. – estus

Большое спасибо .. еще один запрос Я не могу отобразить это {{empname}} {{empnumber}}. Не могли бы вы помочь в этом. –

Да, ошибка исправлена, спасибо ... –

Получение ошибки при передаче данных между контроллерами с использованием примерной службы

ответ

Смежные вопросы