无法从外部 js 文件访问 angular 服务

Question

这是我的 html:

<html>
<head>
  <link rel="stylesheet" type="text/css" href="css/style.css">
  <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>

</head>
<body>
<script type="text/javascript" src="services.js"></script>
 <div ng-app="myApp" ng-controller="myCtrl2">
   hello {{x}} 
 </div>
 <script>
  var app=angular.module("myApp", []);
  app.controller("myCtrl2", ['$scope','$location', function($scope, $location) {
    myService.set("world");
    $scope.x=myService.get();
  }]);
</script>
</body>
</html>

这是我的 services.js 文件：

    var app=angular.module("myApp", []);
    app.factory('myService', function() {
     var savedData = {}
     function set(data) {
       savedData = data;
     }main.html
     function get() {
      return savedData;
    }

    return {
      set: set,
      get: get
    }

  });

为什么我没有得到 hello world 而是 chrome 开发人员工具说：ReferenceError: myService is not defined

Answer 1

您需要更正一些事情

不要在 html 页面上重新创建 myApp 模块，那样会破坏模块的旧注册组件。而是使用 services.js.
创建的现有 myApp 模块
```
var app=angular.module("myApp", []);
```
应该是
```
var app=angular.module("myApp");
```

在控制器中使用之前先注入服务。

app.controller("myCtrl2", ['$scope','$location', 'myService', 
    function($scope, $location, myService) {

Answer 2

你需要在控制器中注入服务

var app=angular.module("myApp", []);
 app.controller("myCtrl2", ['$scope','$location','myService', function($scope, $location,myService) {
  myService.set("world");
  $scope.x=myService.get();
}]);

Answer 3

您需要将服务注入控制器。

app.controller("myCtrl2", ['$scope','$location', function($scope, $location,myService) {

无法从外部 js 文件访问 angular 服务

cannot access angular service from external js file

javascript

dependency-injection

angularjs

angularjs-service

angularjs-controller