angular.js - angluarjs controller封裝問題

Question

是這樣的 樓主目前正在學習angularjs 遇到了一個困難
在主頁 index.html 有一個模組 ng-app="Demo"，樓主用這個模組依賴了ui-router進行路由。
子頁面程式碼會被載入到 index.html 頁面中。

現在問題來了，我將子頁面封裝成了一個使用者元件一樣的東西。中間有它自己的model,service,controller。
model跟service還好說，問題是controller怎麼使用主頁的ng-app="Demo" ，並且在使用的時候還需要將它對應的service以及model注入進來，注意是在路由子頁面的時候，將controller綁定到主頁面的Demo 模組中，並且需要新增新的依賴model,service

這個是主頁的js檔:

    angular
        .module("Demo", [
            "ui.router",
            "oc.lazyLoad"
        ])
        .config([
            "$stateProvider",
            "$urlRouterProvider",
            function($stateProvider, $urlRouterProvider) {
                $urlRouterProvider.otherwise("/main/login");
                $stateProvider.state("main", {
                        url: "/main",
                        abstract: true,
                        template: '<ui-view ></ui-view>'
                    })
                    .state("main.login", {
                        url: '/login',
                        templateUrl: 'scripts/templateuser/view/login.html',
                        resolve: {
                            deps: ["$ocLazyLoad", function($ocLazyLoad) {
                                return $ocLazyLoad.load([
                                    "./scripts/templateuser/controller/basic/login.js",
                                    "./scripts/common/common.fun.js",
                                    "./scripts/templateuser/model/basic/owner.js"
                                ]);
                            }]
                        }
                    })
            }
        ])

這個是子頁面的controller：

(function(angular) {
    "use strict"
    angular
        .module("Demo", [
            "Task.Common",
            "Task.TemplateModel"
        ])
        .controller("Task.TemplateUser.Controller.Basic.Login", [
            "$scope",
            "Task.TemplateUser.Service.PostService",
            "Task.TemplateUser.Model.Basic.Owner",
            LoginController
        ]);

    function LoginController($scope) {
        console.log($scope.OwnerInfo.OwnerName);
        var url = "";
        var data = {};
        var success = function() {};
        var error = function() {};
        var content = $scope.component.content;
        $scope.getowner = function() {
            EventPost.Post(url, data, success, error);
        }
    };
})(window.angular)

我這樣弄之後,controller裡面的程式碼根本不會載入 這是怎麼回事

Answer 1

angular.module方法在不傳入第二個參數的時候才是取得已註冊的模組，否則就是建立新的模組