要实现Angular的动态base-href,你可以使用Angular提供的动态元数据来设置base href。下面是一个示例解决方法:
import { enableProdMode } from '@angular/core';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
// 获取base href
const baseHref = document.querySelector('base').getAttribute('href');
// 替换掉占位符
const indexHtml = document.documentElement.innerHTML.replace('%BASE_HREF%', baseHref);
document.documentElement.innerHTML = indexHtml;
platformBrowserDynamic()
.bootstrapModule(AppModule)
.catch(err => console.error(err));
import { Component } from '@angular/core';
import { Meta } from '@angular/platform-browser';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
constructor(private meta: Meta) {
// 设置动态的base href
this.meta.updateTag({ property: 'og:url', content: window.location.href });
}
}
这样,每当应用程序加载时,都会动态设置base href为当前页面的URL。这使得你的应用程序可以在不同的环境中正确地处理路由。