Угловая маршрутизация 2 внутри компонента не работает (this.router.navigate не работает)

1

Я пытаюсь разработать приложение углового 2, которое направляется к другому компоненту после выполнения определенного условия, для этого я использовал метод this.router.navigate, но он, похоже, не выполняется, поскольку он продолжает показывать "Невозможно прочитать свойство", неопределенной "ошибки. оценят любую помощь по этому поводу :)

Конкретный компонент

import { Component, OnInit } from '@angular/core';

import { RouterModule, Routes, Router } from '@angular/router';

@Component({
  selector: 'app-searching',
  templateUrl: './searching.component.html',
  styleUrls: ['./searching.component.css']
})
export class SearchingComponent implements OnInit {

constructor(private router:Router) { }

ngOnInit() {
 var elem = document.getElementById("rightSideMovingProgressBar"); 
 var elem2 = document.getElementById("progressText");
 var height = 100;
 var height2 = 0;
 var id = setInterval(frame, 20);
 function frame() {
    if (height <= 0) {
        clearInterval(id);
        this.router.navigate(['/details']);
    } else {
        height--;
        height2++; 
        elem.style.height = height + 'vh';
        elem2.innerHTML = height2 + '%'; 
    }
  } 
}

}

Ошибка

Изображение 174551

Теги:
angular
router

2 ответа

3
Лучший ответ

Это потому, что this в frame больше не указывает на компонент. Используйте следующее:

 var id = setInterval(()=>{ frame() }, 20);

Прочитайте это и это отвечает за дополнительной информацией и других возможных подходов с использованием bind и bound class properties.

1

Вы можете сохранить this в переменной:

var that = this;

внутри функции, которую вы можете использовать как

that.router.navigate(['/details']);

Надеюсь это поможет :)

  • 0
    Большое спасибо :), ваши ответы и ответы Максима сделали свое дело :)

Ещё вопросы

Сообщество Overcoder
Наверх
Меню