使用angularjs 1.5，routeProvider不起作用並且控制器未定義

Question

我正在開發我的第一個應用程序。 當我在網絡瀏覽器中打開它時，出現以下錯誤：Uncaught ReferenceError：在app.js：15處app.js：3處未定義控制器

創建app.js文件並嘗試將controller.js鏈接到該文件后，出現此錯誤。 另外，routeProvider似乎還無法正常工作。 我的占位符停止工作了，以前確實工作過。

我簡化了代碼以保持可讀性。 我有更多的html文件，並將引導程序與JQuery和CSS結合使用。 有人知道這是怎么回事嗎？

app.js

(function(){

    var myApp = angular.module('myApp',     ['ngRoute']).controller('controller', controller)

    .config(function($routeProvider, $locationProvider){
    $locationProvider.html5Mode(true);
    $routeProvider
        .when('/main', {
            templateUrl: '../main.html',
                controller: 'controller'
        })
        .otherwise({redirectTo: '../main'});

});
})();

controller.js

     (function() {
         angular.module('controller', ['ngRoute'])
             .controller('controller', ['$scope', function ($scope) {
        }]);
    })();

的index.html

<!DOCTYPE html>
<html data-ng-app = "myApp">

<head>
<meta charset="utf-8"/>
<title> Who Brings What </title>
</head>

<body>
<div class="container">
    <nav class="navbar navbar-default">
/*more code here */
    </nav>
</div>

<div data-ng-view></div>

<script     src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js">    </script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular-    route.js"></script>
<!--<script     src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular-   route.js">    </script>-->
<script src = "../controller.js"></script>
<script src = "../app.js"></script>

</body>

</html>

main.html中

<div>
    Main Body
</div>

Answer 1

您的代碼幾乎沒有問題，

（i）由於已在單個文件中單獨定義了控制器，因此可以安全地將其從初始模塊中刪除。

function(){
var myApp = angular.module('myApp',['ngRoute'])
myApp.config(function($routeProvider, $locationProvider){
    $locationProvider.html5Mode(true);
    $routeProvider
        .when('/main', {
            templateUrl: './main.html',
                controller: 'controller'
        })
        .otherwise({redirectTo: '/main'});
});
})();

（ii）您不需要兩次注入ngRoute，您可以使用全局聲明的模塊

 (function() {
           app.controller('controller', ['$scope', function ($scope) {
        }]);
 })();

DEMO

使用angularjs 1.5，routeProvider不起作用並且控制器未定義

問題描述

1 個解決方案

解決方案1
0 2017-04-05 16:58:10

使用angularjs 1.5，routeProvider不起作用並且控制器未定義

問題描述

1 個解決方案

解決方案1 0 2017-04-05 16:58:10

解決方案1
0 2017-04-05 16:58:10