Angular 2: предотвращение маршрутизации на новую страницу в случае сбоя службы

0

В моем приложении Angular 2

home.html

<div>
<nav>
    <a [routerLink]="['Users']">Users</a>
</nav>
</div>

app.component.ts

import {Component} from 'angular2/core';
import {Router,RouteConfig, ROUTER_DIRECTIVES,RouterOutlet} from 'angular2/router';
import {UsersComponent} from './users/users'

@Component({
    selector: 'my-app',
    templateUrl: 'views/home.html',
    directives: [ROUTER_DIRECTIVES, RouterOutlet]
})
@RouteConfig([
{
    path: '/users',
    name: 'Users',
    component: UsersComponent
}
])
export class AppComponent { 

constructor(private _router:Router) {}
}

users.ts

import {Component} from 'angular2/core';
import {NgForm} from 'angular2/common';
import {DataService} from '../service';

@Component({
selector: 'my-app',
templateUrl: 'views/user.html'
})

export class UsersComponent {

constructor(private dataService: DataService) {
    this.dataService.getUserList().subscribe(
            (res) => {
                console.log('response=>' + res);
            },
            (error) => {
                console.log('failure);
            });
}
}

Если есть какие-либо сбои в обслуживании, я хочу предотвратить маршрутизацию на страницу user.html.

Любые предложения будут высоко оценены.

Теги:
angular
angular-services

1 ответ

1

CanActivate - это правильный обратный вызов жизненного цикла, чтобы сделать это.

В настоящее время использование DI в @CanActivate() требует уродливого обходного пути (https://github.com/angular/angular/issues/4112), но команда Angular работает над улучшением этого.

  • 0
    Не могли бы вы опубликовать, как использовать CanActivate с моим кодом?
  • 2
    plnkr.co/edit/SF8gsYN1SvmUbkosHjqQ?p=preview не должно быть слишком сложным для адаптации к вашему коду.

Ещё вопросы

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