Angularjs材料设计md-tab:在更改选项卡之前进行验证

时间:2017-06-27 17:10:31

标签: angular angular-material

如果validate函数返回true,如何调用validate函数并更改md-tab。

1 个答案:

答案 0 :(得分:0)

对于选项卡正在使用路由的情况...每个选项卡都有不同的路由。您可以在更改选项卡之前使用Guards进行验证。

警卫信息:https://angular.io/guide/router#milestone-5-route-guards

警卫是一种拦截器,这是我用于身份验证的警卫的一个例子,希望它有所帮助。

  import { Injectable } from '@angular/core';
  import { CanActivate, Router, ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular/router';
  import { Observable } from 'rxjs/Observable';
  import {AuthService} from '../services/auth.service'
  @Injectable()
  export class AuthGuard implements CanActivate {
    constructor(private authservice: AuthService, private router: Router) {
    }

    canActivate(next: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<boolean> | Promise<boolean> | boolean {
      if (this.authservice.isAuthenticated()){
        return true;
      } else {
        this.router.navigate(['auth/signIn'], {});

      }
    }

  }