AngularJS ngRoute路由無法正確注入我的頁面？

Question

我正在嘗試使用ng-view在單頁應用程序中注入頁面。 當我導航到localhost：1337 / home或localhost：1337 /＃/ home時，不能正確注入views / pages / home.html，應該這樣做。 這是用於啟動我的nodeJS服務器的代碼，其后是前端代碼，該代碼無法正常工作。 :(

謝謝你的幫助！

應用程序/ server.js

var express = require('express');
var app = express();
var path = require('path');

app.use(express.static(__dirname + '/public'));

app.use('*', function(req, res) {
    res.sendFile(path.join(__dirname,'/public/views/index.html'));
});

app.listen(1337);

應用程序/公/ index.html的

<!DOCTYPE html>
<html lang="en">
<head>

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1"
    <!-- Set the base path for angular routing -->
    <base href="/">

    <!-- Add bootstrap and font awesome to make the site look pretty. -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">

    <!-- Add angular and angular-routes via CDN. -->
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-route.min.js"></script>

    <!-- Load our custom angular app and app routes. -->
    <script src="js/app.js"></script>
    <script src="js/app.routes.js"></script>

</head>

<body class="container" ng-app="testApp" ng-controller="mainController as main">

    <header>
        <navbar>
            <ul>
                <li><a href="/home">Home</a></li>
                <li>About</li>
                <li>Contact</li>
            </ul>
        </navbar>
    </header>

    <!-- Our pages will be injected here by AngularJS -->
    <main>
        <div ng-view></div>
    </main>

</body>

</html>

應用程序/公/ JS / app.js

angular.module('testApp', [])

.controller('mainController', function() {
    var vm = this;
    vm.message = 'Main controller, testing.';
})

.controller('homeController', function () {
    var vm = this;
    vm.message = 'Welcome to the home page!';
});

應用程序/公/ JS / app.routes.js

angular.module('routerRoutes', ['ngRoute'])

.config(function($routeProvider) {

$routeProvider
    .when('/home', {
        templateUrl: 'views/pages/home.html',
        controller: 'homeController',
        controllerAs: 'home'
    });

});

應用程序/公/視圖/頁/ home.html做為

<div>
    <h1>This is the home page! {{ home.message }}</h1>
</div>

Answer 1

添加'routerRoutes'模塊作為'testApp'模塊的依賴項：

angular.module('testApp', ['routerRoutes']);

AngularJS ngRoute路由無法正確注入我的頁面？

問題描述

1 個解決方案

解決方案1
1 已采納 2015-07-19 06:31:01

AngularJS ngRoute路由無法正確注入我的頁面？

問題描述

1 個解決方案

解決方案1 1 已采納 2015-07-19 06:31:01

解決方案1
1 已采納 2015-07-19 06:31:01