ng2-toastr не работает в приложении angular 4

Сообщение ng2-toastr работает нормально, когда оно находится внутри:

data => {
        this.toastr.info('OOPS!!!', 'Information!');
        this.dictData = data;
        console.log(this.dictData);
        this.results = data.results;
        console.log(this.results);

      } ,

Но не работает, когда он внутри:

   error => {
            console.log("some error occured");
            console.log(error.errorMessage);
            this.toastr.error('OOPS!!!', 'Error!');
            if (error.status === 404) {
              this.router.navigate(['/errornotfound']);
            }
}

Не могу понять, почему он так себя ведет.

Любая помощь высоко ценится.


person vennapusa    schedule 01.06.2018    source источник
comment
попробуйте this.toastr.info внутри раздела ошибок и посмотрите, работает ли он. Просто чтобы убедиться, что это не связано с методом ошибки в тоастре   -  person Rukshan Dangalla    schedule 01.06.2018
comment
да пробовал но не работает   -  person vennapusa    schedule 01.06.2018
comment
Сможете ли вы опубликовать весь блок кода?   -  person Rukshan Dangalla    schedule 01.06.2018
comment
вот ссылка на github со всем кодом:   -  person vennapusa    schedule 01.06.2018
comment
github.com/saisreereddy/Project1   -  person vennapusa    schedule 01.06.2018
comment
Глядя на это сейчас.   -  person Rukshan Dangalla    schedule 01.06.2018


Ответы (1)


Вот что происходит. При возникновении ошибки вы немедленно перенаправляетесь на страницу с ошибкой из полного просмотра страницы. Но ваше всплывающее уведомление настроено в FullpageviewComponent. Так что это на самом деле показывает сообщение об ошибке. Но вы уже перешли на страницу с ошибкой и из-за этого не видите тост.

Вы можете проверить эту теорию, закомментировав перенаправление ошибки, как показано ниже:

error => {
        console.log("some error occured");
        console.log(error.errorMessage);
        this.toastr.info('OOPS!!!', 'Information!');
        // if (error.status === 400) {
        //   this.router.navigate(['/errorbadrequest']);
        // }
        // if (error.status === 404) {
        //   this.router.navigate(['/errornotfound']);
        // }
        // if (error.status === 403) {
        //   this.router.navigate(['/errorauthenticationfailed']);
        // }
        // if (error.status === 414) {
        //   this.router.navigate(['/errorurltoolong']);
        // }
      }

Решение 01.

Вы можете отобразить всплывающее уведомление на странице ошибки вместо FullpageviewComponent.

Решение 02.

Покажите всплывающее уведомление об ошибке в FullpageviewComponent, а затем перейдите на страницу ошибки. Для этого вам нужно использовать событие вида onToastClose.

Решение 03.

Другое решение — создать отдельную службу для отображения всплывающих сообщений. Настройте всплывающее уведомление на корневом уровне вашего приложения. Таким образом, вам не нужно добавлять тост в каждый компонент.

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

person Rukshan Dangalla    schedule 01.06.2018