Question

我正在尝试使用angular-route在我的angularJS应用程序上执行路由。但是，当我尝试在浏览器中加载/销售时，没有任何内容出现（我尝试使用'＃'并得到相同的结果）。这是我的 main.js 文件：

'use strict';

/**
 * @name Main module
 * @description
 */
var app = angular.module('app', ['ngResource', 'ngRoute']);

app.config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider){
  $routeProvider.when('/sales', {
    controller  : 'SalesCtrl',
    templateUrl : '/views/sales.html'
  });

  $locationProvider.html5Mode(true);
}]);

这是我的 index.html

<!doctype html>
<html class="no-js" lang="">
  <head>
    <meta charset="utf-8">
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>webapp</title>

    <link rel="apple-touch-icon" href="apple-touch-icon.png">
    <!-- Place favicon.ico in the root directory -->

    <!-- build:css styles/vendor.css -->
    <!-- bower:css -->
    <!-- endbower -->
    <!-- endbuild -->

    <!-- build:css styles/main.css -->
    <link rel="stylesheet" href="styles/main.css">
    <!-- endbuild -->

    <!-- build:js scripts/vendor/modernizr.js -->
    <script src="/bower_components/modernizr/modernizr.js"></script>
    <!-- endbuild -->
  </head>
  <body>
    <!--[if IE]>
      <p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
    <![endif]-->

    <!-- Google Analytics: change UA-XXXXX-X to be your site's ID. -->
    <script>
      (function(b,o,i,l,e,r){b.GoogleAnalyticsObject=l;b[l]||(b[l]=
      function(){(b[l].q=b[l].q||[]).push(arguments)});b[l].l=+new Date;
      e=o.createElement(i);r=o.getElementsByTagName(i)[0];
      e.src='https://www.google-analytics.com/analytics.js';
      r.parentNode.insertBefore(e,r)}(window,document,'script','ga'));
      ga('create','UA-XXXXX-X');ga('send','pageview');
    </script>

    <!-- build:js scripts/vendor.js -->
    <!-- bower:js -->
    <script src="/bower_components/jquery/dist/jquery.js"></script>
    <script src="/bower_components/modernizr/modernizr.js"></script>
    <script src="/bower_components/angular/angular.js"></script>
    <script src="/bower_components/angular-resource/angular-resource.js"></script>
    <script src="/bower_components/angular-route/angular-route.js"></script>
    <!-- endbower -->
    <!-- endbuild -->

    <!-- build:js scripts/main.js -->
    <script src="scripts/main.js"></script>
    <script src="scripts/services/sales.js"></script>
    <script src="scripts/services/appconfig.js"></script>
    <script src="scripts/controllers/sales.js"></script>
    <!-- endbuild -->

    <div ng-app="app">
      <div ng-view></div>
    </div>
  </body>
</html>

我正在使用角度1.6.1。谁能告诉我我做错了什么？

Answer 1

Angular 1.6.1默认hashPrefix现在是！如文档和changelog

中所述

$locationProvider.html5Mode(false);$locationProvider.hashPrefix('');

这应该有用。

Answer 2

尝试

$locationProvider.html5Mode(false);

访问http://yourapp.com/#/page而不是http://yourapp.com/page

AngularJS在路由时给出“无法获取/页面”

2 个答案: