简单的 ng-Route 在 ng-View 中不起作用答案

【问题标题】：Simple ng-Route not working in ng-View简单的 ng-Route 在 ng-View 中不起作用
【发布时间】：2016-02-25 06:44:46
【问题描述】：

我有一个简单的示例，其中默认的 one.html 必须由 ng-Route 可见，但我得到了一个错误。

HTML：

<html>
<head>
<script src= "http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
<script src="http://code.angularjs.org/1.2.1/angular-route.min.js"></script>
<script src= "angularScript.js"></script>
</head>
<body ng-app="myApp" ng-controller="myCtrl">
<div ng-view=""></div>
</body> 
</html>

angularScript.js

//App Declaration 
var app = angular.module('myApp', ['ng-Route'] );

//Controllers 
app.controller('myCtrl', function($scope) {

});

//Routers 
app.config(function($routeProvider){

    $routeProvider
    .when('/one', {
        title: 'one',
        controller: 'oneCtrl',
        templateUrl: 'one.shtml'
    })  
    .when('/two', {
        title: 'two',
        controller: 'twoCtrl',
        templateUrl: 'two.shtml'
    })  
    .when('/three', {
        title: 'three',
        controller: 'threeCtrl',
        templateUrl: 'three.shtml'
    })  
    .otherwise({
        title: 'one',
        redirectTo: '/one'
    });
});

一个.html

This is one

我正在依赖 ng-Route 并尝试使用 ng-view 在 div 的页面中获取默认的 one.html 内容，但我在控制台上收到以下错误：

未捕获的错误：[$injector:modulerr] http://errors.angularjs.org/1.3.14/$injector/modulerr?p0=myApp&p1=Error%3A%…gleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.3.14%2Fangular.min.js%3A17%3A381)

【问题讨论】：

使用
你没有在任何地方指定控制器
var app = angular.module('myApp', ['ngRoute'] ); app.config(['$routeProvider',function ($routeProvider) {

标签： angularjs controller routing ngroute

【解决方案1】：

在您的 angularjs 脚本中尝试以下代码

    //App Declaration 
var app = angular.module('myApp', ['ngRoute'] );

//Controllers 
app.controller('myCtrl', function($scope) {

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

});
//Routers 
app.config(function($routeProvider){

    $routeProvider
    .when('/one', {
        title: 'one',
        controller: 'oneCtrl',
        templateUrl: 'one.shtml'
    })  
    .when('/two', {
        title: 'two',
        controller: 'twoCtrl',
        templateUrl: 'two.shtml'
    })  
    .when('/three', {
        title: 'three',
        controller: 'threeCtrl',
        templateUrl: 'three.shtml'
    })  
    .otherwise({
        title: 'one',
        redirectTo: '/one'
    });
});

你需要在控制器和ngRoute中指定oneCtrl

【讨论】：

使用 angular.js 而不是 angular.min.js 用于开发目的。它将向您显示更具体的错误描述