Fatal编程技术网
  • javascript/
  • Javascript 为什么在向AngularJS应用程序添加多条路线时会出现模块错误？

Javascript 为什么在向AngularJS应用程序添加多条路线时会出现模块错误？

javascript python angularjs flask

Javascript 为什么在向AngularJS应用程序添加多条路线时会出现模块错误？,javascript,python,angularjs,flask,angular-routing,Javascript,Python,Angularjs,Flask,Angular Routing,如果我在我的app.js中有一个.when（）路由，testApp模块将加载，站点将正常工作。但是，当我添加另一个.when（），（例如about和contact）时，我的模块将不会加载 见： 我安装了AngularJS和AngularRoutes，并指定了ngRoute依赖项（在app.js中）： 有什么想法吗 代码如下： app.py from flask import Blueprint, make_response mod = Blueprint('main', __name__)

如果我在我的app.js中有一个
.when（）
路由，testApp模块将加载，站点将正常工作。但是，当我添加另一个
.when（）
，（例如about和contact）时，我的模块将不会加载

见：

我安装了AngularJS和AngularRoutes，并指定了
ngRoute
依赖项（在app.js中）：

有什么想法吗

代码如下：

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>
你有语法错误；不能在以
结尾的行之后立即有以
开头的行。删除每个
when
子句后面的分号。
删除when子句末尾的分号，最后一个除外有时您只需要第二组眼睛。。。谢谢

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())



    <!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>



// 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';
});