原因: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. WebService的调用

    今天测试用代码如何去调用WebService,因为之前都是直接vs直接引用,网上搜索的很多也并没有讲清楚,搞得一直不得劲.其实基元对象(string/int等)的调用倒是挺简单的,根据方法名赋值传参就 ...

  2. kubernets controller 和 CRD 具体组件分析

    (dlv) b k8s.io/sample-controller/pkg/client/informers/externalversions.(*sharedInformerFactory).Info ...

  3. docker17.03.2安装

    之前安装过docker 卸载 yum -y remove docker docker-common docker-selinux docker-engine docker-engine-selinux ...

  4. CEF 自定义用户协议(scheme)实现以二进制流的方式显示图片、视频、音频

    转载:https://www.cnblogs.com/sinceret/p/10417941.html 转载:https://stackoverflow.com/questions/48811756/ ...

  5. Integer类toString(int i,int radix)方法

    Integer类toString(int i,int radix)方法: 首先抛出java的api中的介绍: public static String toString(int i, int radi ...

  6. tcp的三次握手,四次挥手

    为了更好的记住知识点,所以将最近学习的知识点记录下来: 最开始A和B都处于closed(关闭连接状态) 1.tcp的第一次握手:客户端A  向服务器端B 发送请求连接报文段(包含SYN=1,初始序号s ...

  7. 如何加速GitHub访问速度

    http://tool.chinaz.com/网站中填入assets-cdn.github.com选取响应最小的ip,将ip.域名填入到C:\Windows\System32\drivers\etc下 ...

  8. VS2010下安装boost库

    在我们的C++项目中安装boost库,下面以VS2010版本作为例子,其它版本的设置也差不多. 一.编译生成boost库 1.下载最新的boost(本人下载的是boost_1_56_0).boost官 ...

  9. 将vmware虚拟机转换成qcow2格式的方法

    将vmware虚拟机转换成qcow2格式的方法 http://blog.51cto.com/13570993/2074071 关于qemu安装出现的问题 1.配置qemu是出现can't find p ...

  10. Spark机器学习基础三

    监督学习 0.线性回归(加L1.L2正则化) from __future__ import print_function from pyspark.ml.regression import Linea ...