routerLink с домашней страницы приводит к пустой странице, в то время как прямое нажатие на URL работает отлично - PullRequest
Новая
       19

routerLink с домашней страницы приводит к пустой странице, в то время как прямое нажатие на URL работает отлично

1 голос
/ 22 июня 2019

Я использую API транслитерации Google в своем угловом проекте.В моем компоненте регистрации есть несколько полей, которые необходимо транслитерировать.У меня есть отдельный сервис для загрузки пакета транслитерации Google.На моей домашней странице есть ссылка на страницу регистрации через привязку routerLink.Когда я нажимаю на эту ссылку с домашней страницы, в консоли отображается пустая страница без ошибок.Однако, когда я напрямую нажимаю на тот же URL из адресной строки, он работает.

Я до некоторой степени отлаживал это и обнаружил, что проблема заключается в конструкторе файла transiterator service.ts.Если я удаляю это, маршрутизация работает нормально с домашней страницы.Но я не уверен, как решить эту проблему, не удаляя служебную зависимость.

Компонент регистрации: 

export class RegistrationComponent implements OnInit, AfterViewInit {

  transLitElementArray: ElementRef[] =[];

   @ViewChild('userDescription') userDescription:ElementRef;
   @ViewChild('displayName') displayName:ElementRef;

  constructor(private transliteratorService:Transliterate) { }

  ngOnInit() {
    
  }

  ngAfterViewInit(){

     this.transLitElementArray.push(this.userDescription);
     this.transLitElementArray.push(this.displayName);

     this.transliteratorService.initializeTransliteration(this.transLitElementArray);

  }

}

Услуга транслитерации: 

export class Transliterate {

  textAreaArray: ElementRef[];

  constructor() {
    google.load("elements", "1", {
      packages: "transliteration"
    });

  }

  initializeTransliteration(elementFromComponent: ElementRef[]) {


    this.textAreaArray = elementFromComponent;
    google.setOnLoadCallback(() => this.onLoad());
  }


  private onLoad() {
    const elements = [];
    this.textAreaArray.forEach((element: ElementRef) => {
      elements.push(element.nativeElement);
    });


    var options = {
      sourceLanguage: 'en',
      destinationLanguage: ['ta'],
      shortcutKey: 'ctrl+g',
      transliterationEnabled: true
    };

    var opt_options = {
      adjustElementStyle: false,
      adjustElementDirection: true
    }

    // Create an instance on Transliteration Control with the required
    // options.
    var control = new google.elements.transliteration.TransliterationControl(options);

    control.makeTransliteratable(elements, opt_options);

  }
}

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

1 Ответ

0 голосов
/ 22 июня 2019

Я решил эту проблему. Если кто-то ищет ответ, обратитесь к ответу на этот вопрос переполнение стека . Спасибо парню, который разместил ответ.

...