2016-07-14 14 views
0

私はこれに類似したいくつかの記事を見ましたが、私は依存関係を正しく実装したと思いますが、 。ここにコードがあります。

IndexController:

/** 
* IndexController 

* @namespace task_list.layout.controllers 
*/ 
(function() { 
    'use strict'; 

    angular 
    .module('task_list.layout.controllers') 
    .controller('IndexController', IndexController); 

    IndexController.$inject = ['$scope', 'Auth', 'Tasks', 'Snackbar']; 

    /** 
    * @namespace IndexController 
    */ 
    function IndexController($scope, Auth, Tasks, Snackbar) { 
    var vm = this; 

    vm.isAuthenticated = Auth.isAuthenticated(); 
    vm.tasks = []; 

    activate(); 

    /** 
    * @name activate 
    * @desc Actions to be performed when this controller is instantiated 
    * @memberOf task_list.layout.controllers.IndexController 
    */ 
    function activate() { 
     Tasks.all().then(tasksSuccessFn, tasksErrorFn); 

     $scope.$on('task.created', function (event, task) { 
     vm.tasks.unshift(task); 
     }); 

     $scope.$on('task.created.error', function() { 
     vm.tasks.shift(); 
     }); 

     /** 
     * @name tasksSuccessFn 
     * @desc Update tasks array on view 
     */ 
     function tasksSuccessFn(data, status, headers, config) { 
     vm.tasks = data.data; 
     } 

     /** 
     * @name tasksErrorFn 
     * @desc Show snackbar with error 
     */ 
     function tasksErrorFn(data, status, headers, config) { 
     Snackbar.error(data.error); 
     } 
    } 
    } 
})(); 

タスク

/** 
* Tasks 
* @namespace task_list.tasks.services 
*/ 
(function() { 
    'use strict'; 

    angular 
    .module('task_list.tasks.services') 
    .factory('Tasks', Tasks); 

    Tasks.$inject = ['$http']; 

    /** 
    * @namespace Tasks 
    * @returns {Factory} 
    */ 
    function Tasks($http) { 
    var Tasks = { 
     all: all, 
     create: create, 
     // edit: edit, 
     // delete: delete, 
     get: get 
    }; 

    return Tasks; 

    //////////////////// 

    /** 
    * @name all 
    * @desc Get all Tasks 
    * @returns {Promise} 
    * @memberOf task_list.tasks.services.Tasks 
    */ 
    function all() { 
     return $http.get('/api/v1/tasks/'); 
    } 

    /** 
    * @name create 
    * @desc Create a new Task 
    * @param {string} name The name of the new Task 
    * @returns {Promise} 
    * @memberOf task_list.tasks.services.Tasks 
    */ 
    function create(name) { 
     return $http.post('/api/v1/tasks/', { 
     name: name 
     }); 
    } 

    /** 
    * @name get 
    * @desc Get the Tasks of a given user 
    * @param {string} username The username to get Tasks for 
    * @returns {Promise} 
    * @memberOf task_list.tasks.services.Tasks 
    */ 
    function get(username) { 
     return $http.get('/api/v1/accounts/' + username + '/tasks/'); 
    } 
    } 
})(); 

Task_list.js

(function() { 
    'use strict'; 

    angular 
    .module('task_list', [ 
     'task_list.routes', 
     'task_list.auth', 
     'task_list.layout', 
     'task_list.tasks', 
     'task_list.config', 
     'task_list.utils', 
    ]); 

    angular 
    .module('task_list.routes', ['ngRoute']); 

    angular 
    .module('task_list.config', []); 

    angular 
    .module('task_list') 
    .run(run); 

    run.$inject = ['$http']; 

    /** 
    * @name run 
    * @desc Update xsrf $http headers to align with Django's defaults 
    */ 
    function run($http) { 
    $http.defaults.xsrfHeaderName = 'X-CSRFToken'; 
    $http.defaults.xsrfCookieName = 'csrftoken'; 
    } 
})(); 

モジュールとそのサブフォルダ(コントローラ、ディレクティブ、サービス)のI負荷。ファイルを小型化し、アプリ内の各モジュールを次のようにロードすることに注意してください。

(function() { 
    'use strict'; 

    angular 
    .module('task_list.layout', [ 
     'task_list.layout.controllers' 
    ]); 

    angular 
    .module('task_list.layout.controllers', []); 
})(); 

ご協力いただきありがとうございます。ありがとう!ここで

は、コンソールログです:JSファイルの

c98216751c41.js:2140 Error: [$injector:unpr] Unknown provider: TasksProvider <- Tasks <- IndexController 
http://errors.angularjs.org/1.5.7/$injector/unpr?p0=TasksProvider%20%3C-%20Tasks%20%3C-%20IndexController 
    at http://127.0.0.1:9090/static/CACHE/js/c98216751c41.js:1507:8 
    at http://127.0.0.1:9090/static/CACHE/js/c98216751c41.js:1721:7 
    at Object.getService [as get] (http://127.0.0.1:9090/static/CACHE/js/c98216751c41.js:1737:122) 
    at http://127.0.0.1:9090/static/CACHE/js/c98216751c41.js:1721:212 
    at getService (http://127.0.0.1:9090/static/CACHE/js/c98216751c41.js:1737:122) 
    at injectionArgs (http://127.0.0.1:9090/static/CACHE/js/c98216751c41.js:1740:58) 
    at Object.instantiate (http://127.0.0.1:9090/static/CACHE/js/c98216751c41.js:1747:106) 
    at $controller (http://127.0.0.1:9090/static/CACHE/js/c98216751c41.js:2000:20) 
    at Object.link (http://127.0.0.1:9090/static/CACHE/js/c98216751c41.js:2681:377) 
    at http://127.0.0.1:9090/static/CACHE/js/c98216751c41.js:1576:296 <div class="col-xs-12 ng-view ng-scope"> 

tasks.module.js

(function() { 
    'use strict'; 

    angular 
    .module('task_list.tasks', [ 
     'task_list.tasks.controllers', 
     'task_list.tasks.directives', 
     'task_list.tasks.services', 
    ]); 

    angular 
    .module('task_list.tasks.controllers', []); 

    angular 
    .module('task_list.tasks.directives', ['ngDialog']); 

    angular 
    .module('task_list.tasks.services', []); 
})(); 

ロード順:

<script type="text/javascript" src="{% static 'javascripts/task_list.js' %}"></script> 

<script type="text/javascript" src="{% static 'javascripts/task_list.config.js' %}"></script> 
<script type="text/javascript" src="{% static 'javascripts/task_list.routes.js' %}"></script> 

<script type="text/javascript" src="{% static 'javascripts/auth/auth.module.js' %}"></script> 
<script type="text/javascript" src="{% static 'javascripts/auth/services/auth.service.js' %}"></script> 
<script type="text/javascript" src="{% static 'javascripts/auth/controllers/register.controller.js' %}"></script> 

<script type="text/javascript" src="{% static 'javascripts/tasks/tasks.module.js' %}"></script> 

<script type="text/javascript" src="{% static 'javascripts/auth/controllers/login.controller.js' %}"></script> 
<script type="text/javascript" src="{% static 'javascripts/layout/layout.module.js' %}"></script> 
<script type="text/javascript" src="{% static 'javascripts/layout/controllers/navbar.controller.js' %}"></script> 

<script type="text/javascript" src="{% static 'javascripts/tasks/directives/tasks.directive.js' %}"></script> 
<script type="text/javascript" src="{% static 'javascripts/tasks/controllers/tasks.controller.js' %}"></script> 

<script type="text/javascript" src="{% static 'javascripts/utils/utils.module.js' %}"></script> 
<script type="text/javascript" src="{% static 'javascripts/utils/services/snackbar.service.js' %}"></script> 

<script type="text/javascript" src="{% static 'javascripts/layout/controllers/index.controller.js' %}"></script> 
+0

を、何これは、Python(またはジャンゴ)と関係があるのでしょうか? – mgilson

+0

タスクサービスが登録されていないようです。あなたのサービスがインスタンス化されているのか、それともロードされているのかを見るためにコンソールログなどを置くことができますか?最終バンドルファイルが含まれているかどうか確認することができます。このエラーは、indexControllerがタスクサービスを見つけることができないために発生します –

+0

@mgilsonそのプロジェクトは私が作業しているのはdjangoにあり、私は自分のビューとして角度を統合しましたが、現時点ではそうではありません。 – hect1c

答えて

0

私は私の問題を解決することができました。私は実際に私のHTMLファイルにtasks_list.serviceスクリプトをロードしていませんでした。オリジナルのコメントを編集したときに、そのことをよく確認できました。私は何とかそれを逃した。私がそれを隔離するのに役立つ応答に感謝します。私のhtmlファイル内のコード行方不明

:好奇心のうち

<script type="text/javascript" src="{% static 'javascripts/tasks/services/tasks.service.js' %}"></script>

関連する問題