Question

我是新角色，从2个月开始使用它，现在在我的项目中，我需要从Angularjs迁移到Angular。所以我需要将整个代码重写为Angular。我看到以前的开发人员使用了很多$ rootScope来存储值并在其他控制器中使用该值。我正在尝试使用服务，以便我可以轻松迁移到Angular 请看我的代码，让我知道我做了什么错误。 plnkr code

以下是我创建工厂服务的代码以及我尝试在其他控制器中访问的服务。 app.js

angular.module('myApp', [])
.factory('Data', function(){
  return {message: "I'm a data from a Service"}
});

first.js

angular.module('myApp', [])
       .controller(FirstCtrl, function($scope, $rootScope){
         $scope.data = Data;

       });

second.js

angular.module('myApp', [])
       .controller(SecondCtrl, function($scope){
         $scope.data = Data;
       });

Answer 1

您需要将工厂注入控制器。 Heres docs： https://docs.angularjs.org/guide/providers

看起来应该是这样的：

App.js

var app = angular.module('myApp', []);

app.factory('Data', function(){
  return {message: "I'm a data from a Service"}
});

app.controller('FirstCtrl', ['$scope', 'Data', function($scope, Data){
  $scope.data = Data.message;
}]);

和html文件：

<html ng-app="myApp">
  <head>
    <title>AngularJS Services</title>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.0-beta.5/angular.min.js"></script>
    <script type="text/javascript" src="app.js"></script>
  </head>
  <body>
    <div>
      <h1>Services</h1>
    </div>
    <div ng-controller ="FirstCtrl">
      {{data}}
    </div>
  </body>
</html>

Answer 2

这是最后一个链接。只是像我这样的新开发人员的教程，可以使用两个控制器之间的数据共享服务： -

var app = angular.module('myApp', []);

app.factory('Data', function(){
  return {message: "I'm a data from a Service", error: "Hey, i have errored :)"}
});

app.controller('FirstCtrl', ['$scope', 'Data', function($scope, Data){
  $scope.data = Data;
}]);

plnkr link here

面对将数据存储到工厂并在不同控制器中使用它的问题

2 个答案: