Question

我没有抛出任何错误，所以我不知道我的代码有什么问题。在浏览器中打开index.html时，看不到分数。

index.html：

<!doctype html>
<html lang="en">
 <head>
  <meta charset="utf-8">
  <title>My HTML File</title>
  <link rel="stylesheet"href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
  <script 
    src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.js"> 
  </script>
  <script 
    src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-animate.js"></script>
  <script src = "app.js"></script>
 </head>
 <body ng-app = "app">
  <p ng-controller="ScoreController">
     Score: {{score.points}}
  </p>
  <p ng-controller="ScoreController">
     <button ng-click="increment()">Increment</button>
  </p>
 </body>
</html>

app.js：

angular.module('app', [])
 .value('randomScore', function(){
   return Math.ceil(Math.random() * 10);
});

angular.module('app').controller('ScoreController', ['randomScore', function 
 ($scope, score, randomScore){
   $scope.score = score;
   $scope.increment = function(){
   $scope.score.points += randomScore();
        };
}]);

index.html-屏幕截图 !image 1

Answer 1

所以事实证明我缺少得分构建者和得分服务：

score-constructor.js：

function Score(randomScore){
this.points = randomScore();
   }

score-service.js：

angular.module('app')
.service('score', Score);

添加这两个文件并解决@Aleksey Solovey在评论中指出的问题，从而解决了此问题。

Answer 2

尝试一下

angular.module('app').controller('ScoreController',['$scope','score','randomScore',function($scope, score, randomScore){
   $scope.score = score;
   $scope.increment = function(){
           $scope.score.points += randomScore();
        };
}]);

无法注入服务

2 个答案: