gpt4 book ai didi

javascript - 无法实例化模块 ngRoute

转载 作者:行者123 更新时间:2023-11-29 19:30:11 25 4
gpt4 key购买 nike

为什么我有这个错误?这是我的错误: “无法实例化模块 ngRoute”

详细信息:

“ Uncaught Error :[$injector:modulerr] http://errors.angularjs.org/1.3.11/ $injector/modulerr?p0=Rerp&p1=Error%3A%2…gleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.3.11%2Fangular.min.js %3A17%3A350)"...

“由于以下原因无法实例化模块 TestApp:错误:[$injector:modulerr] http://errors.angularjs.org/1.3.11/ $injector/modulerr?p0=...)"

“由于以下原因无法实例化模块 ngRoute:错误:[$injector:nomod] http://errors.angularjs.org/1.3.11/ $injector/nomod?p0=ngR..."

HTML:

<!DOCTYPE html>
<html lang="en" ng-app="TestApp">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<title>Test</title>

<!-- JQUERY -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>

<!-- BOOTSTRAP -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css"/>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"> </script>
</head>

<body ng-controller="MainCtrl">
<div class="main">
<div class="container" ng-view="">
</div>
</div> <!-- fine main -->

<!-- ANGULAR -->
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.11/angular.min.js"></script>
<script scr="//ajax.googleapis.com/ajax/libs/angularjs/1.3.11/angular-route.js"></script>
<script src="app.js"></script>
</body>

</html>

APP.JS:

var TestApp = angular.module('TestApp', ['ngRoute']);
var configuration = {
appPartialPath: "/partial/",
appApiEntryPoint: "/api/"
};

TestApp.config(['$routeProvider', function ($routeProvider) {
$routeProvider
.when('/moduli', {
templateUrl: configuration.appPartialPath + 'moduli.html',
controller: 'ModuliCtrl'
})

.otherwise({
redirectTo: '/',
controller: 'MainCtrl'
});
}]);

/* CONTROLLER MAIN FORM */
TestApp.controller('MainCtrl', function ($scope) {
console.log("APP STARTED");
});

最佳答案

我解决了你的问题,如果你还需要的话:

应用程序.js:

var testApp = angular.module('testApp', ['ngRoute']);
var configuration = {
appPartialPath: "/partial/",
appApiEntryPoint: "/api/"
};

testApp.config(function ($routeProvider,$locationProvider) {
$routeProvider
.when('/', {
templateUrl: 'views/main.html',
controller: 'MainCtrl'
});
});

/* CONTROLLER MAIN FORM */
testApp.controller('MainCtrl', function ($scope) {
console.log("APP STARTED");
});

和index.html:

<!DOCTYPE html>
<html>

<head>
<meta charset="UTF-8" />
<meta content="IE=edge" http-equiv="X-UA-Compatible" />
<meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport" />
<title>Test</title>
<!-- JQUERY -->
<script src="https://code.angularjs.org/1.3.11/angular.js"></script>
<script src="https://code.angularjs.org/1.3.11/angular-route.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<!-- BOOTSTRAP -->
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" />
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
</head>

<body ng-app="testApp">
<div class="main">
<div ng-view="" class="container"></div>
</div>
<!-- fine main -->
<script src="app.js"></script>
</body>

</html>

问题是,您需要将这两个脚本放在头脑中而不是 body 中,以便在执行 angular 之前加载它们。此外,我修复了您的 $routeprovider,因此您可以正确调用 Mainctrl。

Here is a Plunkr I made to show the result.

关于javascript - 无法实例化模块 ngRoute,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28252541/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com