Angular 4 Routing - base-href присоединяется к hashPath - PullRequest
Новая
       7

Angular 4 Routing - base-href присоединяется к hashPath

0 голосов
/ 21 мая 2018

Когда встроенная версия углового приложения помещается в корень, он генерирует URL-адрес очень хорошо

http://thisismydomain.com/#/master/data-source-management/data-sources/list

Но когда он находится где-то глубже внутри корня, иЯ использую base-href, маршрутизатор по-прежнему работает нормально при загрузке страницы, но после загрузки base-href добавляется к хэш-пути, как показано ниже:

http://thisismydomain.com/deeper/inside/#/deeper/inside/master/data-source-management/data-sources/list

Ожидаемый URL:

http://thisismydomain.com/deeper/inside/#/master/data-source-management/data-sources/list

Я обнаружил, что проблема связана с внедрением записи APP_BASE_HREF в раздел импорта файла app.module.ts? 

providers: [
AuthenticationService,
KaribaService,
GlobalService,
NotificationService,
/*
{
  provide: APP_BASE_HREF,
  useFactory: getBaseHref,
  deps: [PlatformLocation]
},
*/
CustomizationService

]

Комментирование этой проблемы решает проблему, но мне это нужно для того, чтобы внедрить BASE_HREF в мои службы для извлечения содержимого из папки активов.ПОМОГИТЕ?

PS Я использую ленивую загрузку.

1 Ответ

0 голосов
/ 22 мая 2018

Я решил это, создав CustomLocationStrategy, расширив HashLocationStrategy, так как это казалось единственным решением. 

import {Injectable} from '@angular/core';
import {HashLocationStrategy} from "@angular/common";

@Injectable()    
export class CustomLocationStrategy extends HashLocationStrategy {

  prepareExternalUrl(internal: string): string {
    const url = this.getBaseHref() + '#' + internal;
    return url;
  }
}

Импортировал пользовательский класс вместе с APP_BASE_HREF и LocationStrategy в app.module.ts 

import { APP_BASE_HREF, LocationStrategy } from "@angular/common";
import { CustomLocationStrategy } from './common/services/customLocationStrategy.service';

и добавил следующее в раздел провайдеров. 

providers: [
  {
    provide: APP_BASE_HREF, 
    useValue: window.location.pathname
  }, 
  {
    provide: LocationStrategy, 
    useClass: CustomLocationStrategy
  }
]
...