Question

我真的很想和Angular一起努力，因为我认为它非常脆弱，而且我有一个非常简单的案例（可能是最简单的案例）但是还没有用。

这是我的模块（所以我注入了库）：

  angular.module(
          'module', ['ui.router']

我的index.html：

<html data-ng-app="module">

<head>
    ... several libraries and my js files including ui-router library js + my app.js where the state definitions are located.
</head>

<body>
    <div ui-view></div>
</body>

为什么我的模板不是用ui-view注入的？

编辑：对不起，我很匆忙，忘了添加一些细节..我已经更新了app.js这样的部分：

    .state('default',
      {
        url: '/',
        template: '<h1>default</h1>'
      })
    .state('x',
      {
        url: '/x',
        template: '<h1>X</h1>'
      });

现在默认状态按预期工作。但是我把网址称为“host / x”我得到一个“不能GET / x”..当我把网址称为“host /＃x”时，它可以工作。

但是我的app.js中还有html5模式的这一部分：

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

我在index.html的主题部分也有这个：

<base href="/">

我想，html5应该已经处理了url的hash（＃）部分？我怎样才能摆脱URL中的＃，所以我可以直接调用“host / x”？

Answer 1

您需要指定url属性并转到此网址以查看此页面。国家应该是这样的：

.state("yourStateName", {
    template: "<h1>My Contacts</h1>",
    url: "/stateURL"
})

这是我的项目的url提供者的工作示例：

 angular.module("app")

  .config(function ($urlRouterProvider, $locationProvider, $stateProvider) {

  $locationProvider
    .html5Mode(true);
  $urlRouterProvider.when('/', '/url1');
  $urlRouterProvider.when('', '/url2');
  $urlRouterProvider.when('/url3', 'url4');
  $urlRouterProvider.otherwise('/url5');
});

为什么Angular UI路由器无法加载我的模板？

1 个答案: