角度路线不起作用

时间:2015-06-29 15:09:11

标签: javascript angularjs url-routing

我正在尝试在我的Angular应用中设置一些基本路线,但似乎无法使ngView正常工作。以下是我的相关index.html代码,模块和配置:

的index.html:

<body ng-app="myApp">
  <h3>Testing is live</h3>
  <div ng-view></div>
</body>

app.module.js:

angular.module('myApp', ['ngRoute', 'ngResource']);

app.config.js:

angular.module('myApp')
  .config(function($routeProvider, $locationProvider) {
    $routeProvider.when('/player/:playerId',
      {
        template: '<h1>testing...</h1>',
        controller: 'PlayerInfoController',
        controllerAs: 'playerInfo'  
      }
    );

    $locationProvider.html5Mode({
      enabled: true,
      requireBase: false,
      rewriteLinks: false
    });
  });

例如,当我访问/player/56时,我看到'测试是实时的',而不是像我期望的那样'测试......'。相反,该部分只有<!-- ngView: -->

2 个答案:

答案 0 :(得分:1)

我对上面的代码进行了两处更改以使其正常工作,但我不完全理解为什么这是必要的;它似乎像一个&#34; hacky&#34;我找到了。

在我的配置文件中:

$locationProvider.html5Mode({
  enabled: true,
  requireBase: false,
  rewriteLinks: false
});

替换为:

$locationProvider.html5Mode(true);

我将以下内容添加到index.html文件的head中:

<base href="/player">

答案 1 :(得分:0)

修复双重声明问题后,您能否判断路线是否被击中?导航到该路由时,您的chrome开发人员工具控制台中是否会调用该PlayerInfoController中的console.log?或者您收到任何类型的错误?