-1
Wenn ich in meiner app.js eine einzelne Route .when() habe, wird das TestApp-Modul geladen und die Site funktioniert. Wenn ich jedoch ein weiteres .when() hinzufüge (etwa über und Kontakt), wird mein Modul nicht geladen.Warum erhalte ich einen Modulfehler, wenn ich mehr als eine Route zu meiner AngularJS-App hinzufüge?
sehen:
angular.js:68 Uncaught Error: [$injector:modulerr] Failed to instantiate module testApp due to: Error: [$injector:nomod] Module 'testApp' 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.
Ich habe AngularJS und Angular-Routen installiert ist, und geben Sie die ngRoute Abhängigkeit (in app.js):
├── angular#1.5.6 extraneous (1.5.7-build.4844+sha.cd3673e available)
├─┬ angular-route#1.5.6 extraneous (1.5.7-build.4844+sha.cd3673e available)
Irgendwelche Ideen?
Hier ist der Code:
app.py
from flask import Blueprint, make_response
mod = Blueprint('main', __name__)
# Pass routing onto the Angular app
@mod.route('/')
@mod.route('/about')
@mod.route('/contact')
def main(**kwargs):
return make_response(open('app/static/index.html').read())
index.html
<!DOCTYPE html>
<html ng-app="testApp">
<head>
<!-- load bootstrap and fontawesome via CDN -->
<link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.css">
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/font-awesome/4.0.0/css/font-awesome.css" />
<!-- load angular and angular route -->
<script src="bower_components/angular/angular.js"></script>
<script src="bower_components/angular-route/angular-route.min.js"></script>
<script src="app.js"></script>
<meta charset="utf-8">
<base href="/">
</head>
<body ng-controller="mainController">
<!-- HEADER AND NAVBAR -->
<header>
<nav class="navbar navbar-default">
<div class="container">
<div class="navbar-header">
<a class="navbar-brand" href="/">Test App</a>
</div>
<ul class="nav navbar-nav navbar-right">
<li><a href="/"><i class="fa fa-home"></i> Home</a></li>
<li><a href="/about"><i class="fa fa-shield"></i> About</a></li>
<li><a href="/contact"><i class="fa fa-comment"></i> Contact</a></li>
</ul>
</div>
</nav>
</header>
<!-- MAIN CONTENT AND INJECTED VIEWS -->
<div id="main">
<!-- this is where template content will be injected -->
<ng-view></ng-view>
</div>
</body>
</html>
app.js
// Create the module
var testApp = angular.module('testApp', ['ngRoute']);
// Routes
testApp.config(function($routeProvider, $locationProvider) {
$routeProvider
// Home page
.when('/', {
templateUrl : 'templates/home.html',
controller : 'mainController'
});
// About
.when('/about', {
templateUrl : 'templates/about.html',
controller : 'aboutController'
});
// Contact
.when('/contact', {
templateUrl : 'templates/contact.html',
controller : 'contactController'
});
$locationProvider.html5Mode(true)
});
// Controllers
// create the controller and inject Angular's $scope
testApp.controller('mainController', function($scope) {
// create a message to display in our view
$scope.message = 'It works!';
});
testApp.controller('aboutController', function($scope) {
// create a message to display in our view
$scope.message = 'About page here';
});
testApp.controller('contactController', function($scope) {
// create a message to display in our view
$scope.message = 'Contact page here';
});
Entfernen Sie das Semikolon am Ende Ihrer when Klauseln mit Ausnahme der letzten – mng
Manchmal brauchen Sie nur eine zweite Reihe von Augen ... Danke. – stealthberry