javascript - 使用html5mode的angularjs中的相对href路径出错

标签 javascript angularjs html

我正在使用 AngularJS 来处理我的 url,并启用了 html5mode。我还使用 gulp-angular 生成器来构建项目。

情况:

索引.js

   $locationProvider
        .html5Mode(true);

index.html

<!-- build:css({.tmp,src}) styles/app.css -->
<!-- inject:css -->
<link rel="stylesheet" href="app/index.css">
<!-- endinject -->
<!-- endbuild -->
<base href="/" />

问题

当 url 为 example.com/somepage 时,index.css 是从 example.com/app/index.css 获取的,但当 url 为 example 时。 com/somepage/somedeeperpage,我刷新页面,index.css 是从 example.com/somepage/app/index.css

获取的

我希望能够在 angular-gulp 生成器中默认使用相对路径。

我是否必须更改为 base 标记或 gulpfile 中的 index.css 相对路径?

奇怪的是,相对路径可以很好地找到 index.js

亲切的问候

最佳答案

编辑: 刚刚发现,如果我将标签放在之前 注入(inject)样式它会起作用...我的 index.html 现在看起来像这样:

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <base href="/">
    <!-- build:css({.tmp/serve,src}) styles/app.css -->
    <!-- inject:css -->
    <!-- endinject -->
    <!-- endbuild -->
</head>

上一个答案:

有同样的问题,通过在我的 index.html 文件中添加并通过更改 gulp/inject.js 中的 gulp-inject 配置来完成这项工作:

之前:

var injectOptions = {
  ignorePath: [options.src, options.tmp + '/serve'],
  addRootSlash: false
};

之后:

var injectOptions = {
  ignorePath: [options.src, options.tmp + '/serve']
};

关于javascript - 使用html5mode的angularjs中的相对href路径出错,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28807251/

相关文章:

html - 定位视频

javascript - sublime 文本的排版工具

javascript - 使用 Helmet 嵌入第三方聊天小部件

javascript - 测试未在 karma/jasmine/require.js 上运行 'There is no timestamp for *lib*!' 错误

javascript - 观看时自动播放 HTML5 视频

html - 将托管 React 应用程序嵌入到另一个非 React 站点的最佳方法是什么?

javascript - 如何在reactjs中获取以前的状态值

javascript - 根据值设置 Highcharts 系列条的颜色

javascript - 无法根据选择按预期隐藏数据

node.js - 来自 post 请求的负载在 node.js 函数中不可用