Angular 2/4/5 - 动态设置基本href我们有一个企业应用程序，它为客户端使用Angular 2。我们每个客户都有自己独特的网址，例如：https://our.app.com/customer-one和https://our.app.com/customer-two。目前我们可以<base href...>动态设置document.location。所以用户点击https://our.app.com/customer-two并<base href...>设置为/customer-two......完美！问题是，如果用户是例如，https://our.app.com/customer-two/another-page并且他们刷新页面或尝试直接点击该URL，则<base href...>设置为get /customer-two/another-page并且找不到资源。我们尝试了以下无济于事：<!doctype html><html><head>
<script type='text/javascript'>
var base = document.location.pathname.split('/')[1];
document.write('<base href="/' + base + '" />');
</script>...不幸的是，我们的想法很新鲜。任何帮助都会很棒。
3 回答
jeck猫
TA贡献1909条经验 获得超7个赞
这就是我们最终做的事情。
将其添加到index.html。它应该是该<head>部分的第一件事
<base href="/"><script>
(function() {
window['_app_base'] = '/' + window.location.pathname.split('/')[1];
})();</script>然后在app.module.ts文件中，添加{ provide: APP_BASE_HREF, useValue: window['_app_base'] || '/' }到提供程序列表，如下所示：
import { NgModule, enableProdMode, provide } from '@angular/core';import { BrowserModule } from '@angular/platform-browser';import { APP_BASE_HREF, Location } from '@angular/common';import { AppComponent, routing, appRoutingProviders, environment } from './';if (environment.production) {
enableProdMode();}@NgModule({
declarations: [AppComponent],
imports: [
BrowserModule,
HttpModule,
routing],
bootstrap: [AppComponent],
providers: [
appRoutingProviders,
{ provide: APP_BASE_HREF, useValue: window['_app_base'] || '/' },
]})export class AppModule { }- 3 回答
- 0 关注
- 2027 浏览
添加回答
举报
0/150
提交
取消