原因:NG2+ 会默认不显示URL后面的文件名

解决方案:使用LocationStrategy方式,然后把URL后的# 替换成index.html#

app.module.ts

 import {HashLocationStrategy , LocationStrategy} from '@angular/common';

 @NgModule({
imports: [ ],
declarations: [
AppComponent,
],
providers: [{provide: LocationStrategy, useClass: HashLocationStrategy}],
bootstrap: [AppComponent]
})
export class AppModule { }

app.component.ts(这一步是后端Tomact不设置默认index.html的情况下才需要的)

   changeURL() {
var text = window.location.href;
text.toString();
var url = text.replace(/\/#/, "/index.html#");
window.history.pushState({}, "0", url);
}
ngAfterContentChecked(){// 每次做完组件视图和子视图的变更检测之后调用,为了防止循环替换,replace使用全替换模式
this.changeURL();
}

详细内容可浏览下一遍文章《Angular2+URL中的 # 引发的思考》

Angular2+ 编译后部署到服务器上页面刷新404问题的更多相关文章

  1. 在Windows系统上一批可以下载但是需要经过编译再安装的第三方的直接编译后的版本(UCI页面)

    在Windows系统上一批可以下载但是需要经过编译再安装的第三方的直接编译后的版本(UCI页面) (https://www.lfd.uci.edu/~gohlke/pythonlibs/) win10 ...

  2. 服务器小白的我,是如何将 node+mongodb 项目部署在服务器上并进行性能优化的

    前言 本文讲解的是:做为前端开发人员,对服务器的了解还是小白的我,是如何一步步将 node+mongodb 项目部署在阿里云 centos 7.3 的服务器上,并进行性能优化,达到页面 1 秒内看到 ...

  3. 转《Angular4项目部署到服务器上刷新404解决办法》

    刚遇到Angular4项目npm run build 后部署到服务器可以访问,但是刷新页面会出现404的错误!转载一大神的操作 解决angular2页面刷新后报404错误办法: 配置app.modul ...

  4. 通过域名访问部署在服务器上的javaweb项目

    因为对域名访问什么也不了解,遇到问题就有种不知道从哪里下手的茫然,也就更不知道错在哪里,前前后后一共折腾了一天多,最后问了阿里客服才成功弄出来,因此记录一下. 关于服务器的购买.配置,及域名的备案解析 ...

  5. Springboot 项目部署到服务器上

    项目部署到服务器上,有两种方式,一种 jar 包,一种 war 包 jar包 部署时,后续的域名配置,SSL证书等在nginx中配置 war包 部署时,后续的域名配置可以在tomcat中配置就好,修改 ...

  6. 将网站部署到服务器上出现_STORAGE_WRITE_ERROR_问题

    用的thinkphp3.2的框架,在本地运行没有问题,部署到服务器上(基于centos的LAMP环境)即报错,报错信息如下(完全看不懂...):求大神帮帮忙~~~~(>_<)~~~~ :( ...

  7. vue-webpack 做出来的项目部署到服务器上,点开是空白页(我这里把项目发布到git上)

    总结1: 从网上下的很多demo,用npm run dev 就可以启动项目,比如:vue-cli,为什么?因为vue-cli自动帮我们安装了express服务器. 总结2: npm run dev 是 ...

  8. sqlite数据库部署到服务器上的问题

    试了一天...本地测试是好的(WIN10 64位+VS2015),部署到服务器上(WIN2008 32位+IIS6) 总是不行..按网上说了什么不要BUNDLE的,加入X86X64目录再放那个SQLi ...

  9. context.getResourceAsStream获取的是部署在服务器上面的文件位置 而不是我们本地的工程位置 意思是说获取的都是web下面的文件位置

    context.getResourceAsStream获取的是部署在服务器上面的文件位置 而不是我们本地的工程位置 意思是说获取的都是web下面的文件位置

随机推荐

  1. CentOS7操作Redis4.0

    单机安装 1. 从官网下载 redis-4.0.10.tar.gz 到本地,然后上传到VMware虚拟机上,存放地址随意. 2. 解压: tar -zxvf redis-4.0.10.tar.gz 3 ...

  2. 解决 js ajax跨域访问报“No 'Access-Control-Allow-Origin' header is present on the requested resource.”错误

    参考页面:https://blog.csdn.net/idomyway/article/details/79572973 如果请求的是PHP页面: header("Access-Contro ...

  3. 原生JS封装创建多级菜单函数

    手写一个使用原生JS封装的多级菜单的函数,满足以下几点需求. 子类层级不确定,可根据数据自动生成多级菜单. 操作便捷,只需传入一个HTML标签. 缺点: 需要满足特定的数据结构 废话不多说,展示代码. ...

  4. 什么是MTBF测试【转】

    本文转载自:https://blog.csdn.net/liuhaoemail/article/details/50531489 MTBF测试 目前,终端侧的可靠性测试基本上是采用称为”MTBF测试” ...

  5. UVA11996 Jewel Magic

    思路 splay维护序列的hash值即可 因为有rev操作,还要维护反串的hash值 代码 #include <cstdio> #include <cstring> #incl ...

  6. HTTP请求与接收get/post方式

    //get方式 public string HttpGet(string Url, string postDataStr) { HttpWebRequest request = (HttpWebReq ...

  7. Gradle 依赖管理

    依赖管理(在 build.gradle 中): 1.定义依赖仓库(repositories): Gradle 要求至少定义一个依赖仓库,依赖仓库可以是文件系统,也可以是中心服务器.最常用的是 jcen ...

  8. C#socket编程之实现一个简单的TCP通信

    TCP(TransmissionControl Protocol)传输控制协议. 是一种可靠的.面向连接的协议(eg:打电话).传输效率低全双工通信(发送缓存&接收缓存).面向字节流.使用TC ...

  9. _spellmod_aura_on_classmask

    -- 修改职业所有技能,公共冷却时间.冷却时间等--小技巧: 根据职业107,108来修改(近期会有改动) `aura` 技能光环ID `spellfamily` 职业代码 `type1` 百分比还是 ...

  10. Win10外包公司(长年承接Win10App外包、Win10通用应用外包)

    在几天前的WinHEC大会中,微软特意在大会中展示了其对通用应用的称呼规范,现在,适用于Windows通用平台的应用的正式名称为“Windows应用”(Windows apps),简洁明了. 总而言之 ...