Angular2如何独立于html基本url设置应用程序根路径

Question

我正在构建一个 angular2 应用程序/小部件，它将作为插件嵌入到 TYPO3 中，可以插入任何内容页面。这意味着它可能以不同的根路径结束，例如:

/page1/app
/page/subpage/subpage/whatever

全局基本 url (base href=..) 已由 TYPO3 设置且无法更改。我怎样才能给 Angular 某种根前缀，以便它可以正确地建立它的路由？

我正在使用此处记录的新路由器:https://angular.io/docs/ts/latest/guide/router.html

Answer 1

实际上在 Angular 文档中有一个解决方案，但很难找到。可以在不使用 <base> 的情况下以 Angular 设置基本 url。标签。
因此，您只需使用 fluid 将基本 url 设置为全局 JavaScript 变量，然后将其提供给应用程序模块中的 angular。

流体:

<script>
   var app_base_url = '<f:uri.page pageUid="{currentPageUid}" />';
</script>

Angular :

declare var app_base_url;

import {Component, NgModule} from '@angular/core';
import {APP_BASE_HREF} from '@angular/common';
@NgModule({
  providers: [{provide: APP_BASE_HREF, useValue:app_base_url}]
})
class AppModule {}

https://angular.io/docs/ts/latest/api/common/index/APP_BASE_HREF-let.html