0

我正在我的网站上创建一个简单的博客部分，所以我想要一个名为帖子的命名空间，它可以动态链接到帖子模板。这些帖子都有自己的模板（即posts/some_post.html），因为它们太不同了，无法仅使用json数据来填充通用模板。

我想要一个命名空间，允许我创建指向每个帖子的链接，以便在生产中我可以发布：mysite/posts/my_new_post。但是，在 .state url 中添加帖子会导致无法实例化模块错误。

这是工作代码的片段：

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

$urlRouterProvider.otherwise('/');

$locationProvider.html5Mode(true);

$stateProvider

  .state('posts', {
    url: '/:postID',
    templateUrl : function($stateParams){
      return 'templates/posts/' + $stateParams.postID + '.html';
    },
  });


}]);

此代码有效，我可以链接到生成的 URI。单击此链接时：

li><a ui-sref="posts({postID: 'blog2'})">blog 2</a></li>

URI 变为 website/blog2，并且从 website/home，我可以链接到 URI

但是，如果我尝试添加命名空间，我会失败：

.state('posts', {
    url: '/posts/:postID',  // note i added posts before the id
    templateUrl : function($stateParams){
      return 'templates/posts/' + $stateParams.postID + '.html';
 },

该链接将第一次工作，并带我到正确的页面但是，如果我输入 URI 模式 mysite/posts/blog1 我得到：未捕获错误：[$injector:modulerr] 错误，并且这个奇怪：未捕获语法错误：意外的令牌 <

不知何故，它没有加载角度，有人有什么想法吗？

4

1 回答 1

0

您正在使用 html5mode，这需要正确配置两件事：

  • 服务器部分-服务器必须知道，某些请求不是针对服务器的..它们是虚拟的。必须发生一些重定向。在此处查看操作方法：如何：配置您的服务器以使用 html5Mode
  • 客户端部分 - 浏览器必须能够理解 url 的哪一部分应该被视为相对的。

要回答第二部分，请查看此 Q & A或该 Q & A以获得一个糟糕的示例/plunker 。

短篇故事：

一般来说，我们必须为 HTML 元素<base>提供默认值的href

<base href="/" />

更长的故事：

它能做什么？好吧，正如您所经历的 - 如果我们直接导航到站点：https://domain/index.html- 浏览器确实知道相对部分是“/”。

但是，如果我们将路由更改为/state/:ID- 生成的 url 是https://domain/state/abc- 如果我们从已经加载的地方导航到那里就可以了index.html。

如果我们直接导航到domain/state/abc-基本 href可能与我们需要的非常不同。这就是<base href="应该提供帮助的地方。

此外，该文档可以提供帮助：

$locationProvider

例如，我们可以像这样请求 html5mode：

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

也可以在这里查看更多详细信息

于 2015-02-06T06:18:08.803 回答