0

启用html5Mode后,我的$routeProvider不再工作。我在这篇文章中看到了同样的问题,但没有什么对我有用。我什至不知道从哪里开始,因为它似乎适用于我遇到的所有其他示例。

我正在使用Express路由到 /index,它工作得很好,但只显示了顶部导航栏ng-view没有加载任何错误。

我的网址结构:

  • Before: localhost:3000/index#/ //这在我启用 html5Mode 之前有效
  • After: localhost:3000/index/ //一旦开启 html5Mode 这个就不行了

我的 index.html 文件:

<!DOCTYPE html>
  <html lang="en" ng-app="mainApp">
  <head>
    <base href="/index">
  </head>

  <body class="bg-light">
    <div navbar></div>

    <div ng-view></div>

    <script src="/jsLib/angular.min.js"></script>
    <script src="/jsLib/angular-route.min.js"></script>
    <script src="/angular/angularApp.js"></script>
    <script src="/jsLib/angular-sanitize.min.js"></script>
    <script src="/jsLib/angular-animate.min.js"></script>
  </body>

  </html>

我的 angularApp.js 文件:

var mainApp = angular.module('mainApp', ['ngRoute', 'ngAnimate']);

mainApp.config(function($routeProvider, $locationProvider) {
    $locationProvider.html5Mode(true).hashPrefix('');

    $routeProvider
    .when('/', {templateUrl : '/partial/wall/feed.html', controller  : 'wallMainController'})

  });

mainApp.directive('navbar', function(){
    return{
        templateUrl: 'partial/template/navbar.html'
    };
});

mainApp.controller('wallMainController', ['$scope', function($scope){

  consolel.log('wallMainController loaded');

}]);

我的快递应用程序:

var express = require('express');
var app = express();
var path = require('path');
var cookieParser = require('cookie-parser');
var bodyParser = require('body-parser');
var fs = require('fs');
var router = express.Router();

app.set('views', path.join(__dirname, 'views'));
app.engine('html', require('hogan-express'));
app.set('view engine', 'html');
app.locals.delimiters = '<% %>';
app.use(express.static(path.join(__dirname, 'public')));
app.use(cookieParser());
app.use(bodyParser.urlencoded({ extended: false }));
app.use(bodyParser.json());

router.get('/', function(req, res){
    res.redirect('/index');
});

router.get('/index', function(req, res, next){
    res.render('index');
});

app.listen(3000, function(){
    console.log('App is working on Port 3000');
});

我最终看到的只是网站上的导航栏,而 ng-view 部分中没有其他内容。我想从这里得到一些指导。根据我的发现,这些建议都没有奏效。我没有添加

4

1 回答 1

0

我通过在 /index 的路径下添加以下内容来修复它

router.get('/*', function(req, res, next) {
  res.sendfile('./views/index.html')
});

这会导致另一个问题,即我的所有其他路线(不在问题中)也被此路径捕获,例如:/login但我将单独研究。这个问题解决了

于 2020-04-26T15:22:48.763 回答