離子/科爾多瓦：模塊無法找到

我定義了以下app.js：離子/科爾多瓦：模塊無法找到

angular.module('myApp', ['ionic', 'myApp.controllers']) 

.run(function ($ionicPlatform) { 
    $ionicPlatform.ready(function() { 
     // Hide the accessory bar by default (remove this to show the accessory bar above the keyboard 
     // for form inputs) 
     if (window.cordova && window.cordova.plugins.Keyboard) { 
      cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true); 
     } 

     if (window.StatusBar) { 
      StatusBar.styleDefault(); 
     } 
    }); 
}) 

.config(function ($stateProvider, $urlRouterProvider) { 
    $stateProvider.state('index', { 
     url: '/', 
     templateUrl: 'templates/home.html' 
    }).state('prints', { 
     url: '/prints', 
     templateUrl: 'templates/photo_prints.html' 
    }).state('box', { 
     url: '/box', 
     templateUrl: 'templates/photo_box.html' 
    }).state('book', { 
     url: '/book', 
     templateUrl: 'templates/photo_book.html' 
    }).state('framed', { 
     url: '/framed', 
     templateUrl: 'templates/photo_framed.html' 
    }); 

    $urlRouterProvider.otherwise("/"); 
});

這controllers.js：

angular.module('myApp.controllers').controller('HomeController', ['$scope', 'productsFactory', homeController]); 

function homeController($scope, productsFactory) { 
    $scope.products = []; 

    init(); 

    function init() { 
     $scope.products = productsFactory.getProducts(); 
    } 
}

我也在我的索引添加兩個腳本。 HTML：

<head> 
    <meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *"> 
    <meta name="format-detection" content="telephone=no"> 
    <meta name="msapplication-tap-highlight" content="no"> 
    <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width"> 

    <!-- Ionic --> 
    <link rel="stylesheet" type="text/css" href="lib/ionic/css/ionic.css"> 
    <script type="text/javascript" src="lib/ionic/js/ionic.bundle.js"></script> 

    <!-- myApp --> 
    <link rel="stylesheet" type="text/css" href="css/style.css"> 
    <script type="text/javascript" src="js/app.js"></script> 
    <script type="text/javascript" src="js/factory.js"></script> 
    <script type="text/javascript" src="js/controllers.js"></script> 
</head>

但是當我嘗試運行此我得到的錯誤：

[$injector:nomod] Module 'myApp.controllers' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.

我的控制器無法找到......爲什麼？我實現它完全像來自cordova或離子提供的標準模板。

來源

2015-05-23 Mulgard

你應該定義你的控制器模塊是這樣的：

angular.module('myApp.controllers', [])

所以......

angular.module('myApp.controllers', []) 
     .controller('HomeController', homeController); 

homeController.$inject = ['$scope', 'productsFactory']; 

function homeController($scope, productsFactory) { 
     $scope.products = []; 

    init(); 

    function init() { 
      $scope.products = productsFactory.getProducts(); 
    } 
}

這是reference。

UPDATE：

當你創建一個新的項目離子 - 讓我們說sidemenu - 你將有一個文件controllers.js這裏所有的控制器進行定義。

這就是你可以定義每一個控制您的應用程序將要使用的地方：

angular.module('myApp.controllers', []) 

.controller('sample1Controller', function($scope) { 

}) 

.controller('sample2Controller', function($scope) { 

}) 

.controller('sample3Controller', function($scope) { 

});

這裏，在此示例中，我定義了3個控制器：sample1Controller，sample2Controller，sample3Controller。

這不是做的事情，但最好的方式。最佳做法是爲每個控制器提供一個js文件。現在我們說它夠好了。

你的主要應用對myApp在這裏定義：

angular.module('myApp', ['ionic', 'myApp.controllers'])

，我想它會附着在你的HTML一些元素：

<body ng-app="myApp"> 
    <ion-nav-view></ion-nav-view> 
</body>

你在你的應用程序一個注射幾個模塊：ionic和您的myApp.controllers。

myApp.controllers是一個自定義模塊：控制器的容器。

你必須從某個地方定義它。這是你會做的方式：

angular.module('myApp.controllers', [])

如果你想你的控制器中的每個單獨的文件中，你可以做這樣的事情。在一個文件中，你可以把你的控制器模塊定義（app.controllers。JS）：

angular.module('app.controllers', []);

和eache文件，你可以有你自己的控制器：

home.js

angular.module('app.controllers') 
    .controller('homeController', function($scope) { 

});

contacts.js

angular.module('app.controllers') 
    .controller('contactsController', function($scope) { 

});

和當然，你有將每個控制器的js文件包含在您的index.html中。

你可以看看這個plunker。

來源

2015-05-24 10:59:41 LeftyX

也許這是一個更好的做法，但它並沒有解決問題。 – Mulgard

創建一個plunker，以便我們可以嘗試修復它。 – LeftyX

不幸的是我不知道你的意思。我使用'離子啓動myApp sidemenu'創建了另一個項目，並使用它。但在我添加了另一個模塊後，我遇到了同樣的問題。它無法找到。 – Mulgard

只應添加您controllers.js頂部這一行：

angular.module('myApp.controllers', []);

來源

2015-05-24 11:53:33 manzapanza

離子/科爾多瓦：模塊無法找到

回答

相關問題