Question

我正在尝试使用Express / Angular提供主视图，这样当访问根URL（'/'）时，会加载视图。现在导航到http://localhost:3000会显示一个包含的空白页面。导航到http://localhost:3000/about会按预期显示关于页面的信息。如何在访问根目录时显示主页部分？

app.js（w / Express 4.9.0）

var express = require('express');
var app = express();
var server = require('http').Server(app);
var io = require('socket.io')(server);
var routes = require('./routes');
var path = path = require('path');

app.set('port', process.env.PORT || 3000);
app.use(express.static(path.join(__dirname, 'public'))); 

server.listen(app.get('port'), function() {
    console.log('Listening on port ' + app.get('port'));
});

app.set('views', __dirname + '/views');
app.set('view engine', 'jade');

app.get('/', routes.index);
app.get('/partials/:name', routes.partials);
app.get('*', routes.index);

路由/ routes.js

exports.index = function(req, res){
    res.render('index');
};

exports.partials = function (req, res) {
    var name = req.params.name;
    res.render('partials/' + name);
};

视图/ index.jade

doctype
html(ng-app="myApp")
    head
        meta(charset='utf8')
        base(href='/')
        title Angular Express Seed App
        link(rel='stylesheet', href='/css/app.css')
    body
        div(ng-controller='AppCtrl')
            div(ng-view)


        script(src='bower_components/angular-loader/angular-loader.js')
        script(src='bower_components/angular/angular.js')
        script(src='bower_components/angular-route/angular-route.js')
        script(src='bower_components/socket.io-client/socket.io.js')
        script(src='js/app.js')
        script(src='js/main.js')
        script(src='js/services.js')
        script(src='js/controllers.js')
        script(src='js/filters.js')
        script(src='js/directives.js')

公开/ JS / app.js

angular.module('myApp', [
    'myApp.controllers',
    'myApp.filters',
    'myApp.services',
    'myApp.directives',
    'ngRoute'
]).
config(function ($routeProvider, $locationProvider) {
    $routeProvider.
    when('/', {
        templateURL: 'partials/home',
        controller: 'MyCtrl2'
    }).
    when('/about', {
        templateUrl: 'partials/about',
        controller: 'MyCtrl1'
    }).
    otherwise({
        redirectTo: '/'
    });

    $locationProvider.html5Mode(true);
});

我还有views/partials/home.jade和views/partials/about.jade

Answer 1

我认为您可能在

中拼错了templateUrl

when('/', {
    templateURL: 'partials/home',
    controller: 'MyCtrl2'
}).

Angular'/'路由不适用于Express

1 个答案: