AngularJS：使用服務

我是Angular的新手，在嘗試使用服務時遇到問題。這裏是我的代碼：AngularJS：使用服務

TodoApp.js：

'use strict' 

var todoApp=angular.module('todoApp',['ngRoute']);

而且service.js

'use strict' 

    todoApp.service('dataServie', [function() { 
this.getTodoData = function() { 
    return [{ 'task': 'shopping', 'due': 1288323623006, 'done': true }, 
    { 'task': 'homework', 'due': 1288323623006, 'done': false }, 
    { 'task': 'cleaning', 'due': 1288323623006, 'done': false }]; 
}; 
}])

而且controller.js

'use strict' 

    todoApp.controller('todoController', ['$scope','dataService', 
function ($scope,dataService) { 
    $scope.todoList = dataService.getTodoData(); 

    $scope.makeDone = function (todo) { 
     todo.done = true; 
    }; 

} 
])

和index.html

<!DOCTYPE html> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <title>Hello</title> 
    <script type="text/javascript" src="Scripts/angular.min.js"></script> 
    <script type="text/javascript" src="Scripts/angular-route.js"></script> 
    <script type="text/javascript" src="Scripts/app/TodoApp.js"></script> 
    <script type="text/javascript" src="Scripts/app/service.js"></script> 
    <script type="text/javascript" src="Scripts/app/Controller.js"></script> 
</head> 

<body ng-app="todoApp"> 
    <h1>hello!</h1> 
    <div ng-controller="todoController"> 
     <ul ng-repeat="todo in todoList"> 
      <li><span>{{todo.task}}</span> 
       <span>{{todo.due | date:'mediumTime'}}</span> 
       <input ng-model="todo.done" type="checkbox" ng-cheked="todo.done"/> 
       <span>{{todo.done}}</span> 
      </li> 
     </ul> 

    </div> 
</body> 

</html>

而且收到此錯誤信息：

錯誤：錯誤：unpr 未知提供商未知提供商：dataServiceProvider < - DataService的

來源

2014-09-25 londondev

看來你有拼寫錯誤在你的服務上，可以這樣嗎？'todoApp.service（'dataServie'，' – 2014-09-25 11:06:15

是的，謝謝Joao。 – londondev 2014-09-25 15:23:45

只是幾個拼寫錯誤。

var todoApp = angular.module('todoApp', ['ngRoute']); 
 

 
todoApp.service('dataService', [ 
 
    function() { 
 
    this.getTodoData = function() { 
 
     return [{ 
 
     'task': 'shopping', 
 
     'due': 1288323623006, 
 
     'done': true 
 
     }, { 
 
     'task': 'homework', 
 
     'due': 1288323623006, 
 
     'done': false 
 
     }, { 
 
     'task': 'cleaning', 
 
     'due': 1288323623006, 
 
     'done': false 
 
     }]; 
 
    }; 
 
    } 
 
]) 
 

 
todoApp.controller('todoController', ['$scope', 'dataService', 
 
    function($scope, dataService) { 
 
    $scope.todoList = dataService.getTodoData(); 
 

 
    $scope.makeDone = function(todo) { 
 
     todo.done = true; 
 
    }; 
 

 
    } 
 
])

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.20/angular-route.min.js"></script> 
 

 
<body ng-app="todoApp"> 
 
    <h1>hello!</h1> 
 
    <div ng-controller="todoController"> 
 
    <ul ng-repeat="todo in todoList"> 
 
     <li><span>{{todo.task}}</span> 
 
     <span>{{todo.due | date:'mediumTime'}}</span> 
 
     <input ng-model="todo.done" type="checkbox" ng-cheked="todo.done" /> 
 
     <span>{{todo.done}}</span> 
 
     </li> 
 
    </ul> 
 

 
    </div> 
 
</body>

來源

2014-09-25 11:12:17 sylwester

您已經註冊的服務呼叫「dataServie」。

您試圖將一個服務調用「dataService」注入到您的控制器中，但它不存在，因此出現錯誤消息。

看起來像一個錯字。服務（ 'dataServie' 應該是。服務（ 'DataService的'

來源

2014-09-25 11:05:47 timsmiths

AngularJS：使用服務

回答

相關問題