我想在登录失败时显示一个快餐栏,指出'错误连接'。这很简单。但是,我希望它在10秒内解散后或者在行动解散小吃店后再次尝试。但是我的observable立即运行,我陷入了一个无限可观的循环,试图在失败后立即登录。卡住角度2的角度材质中的MdSnackBar的Observable Loop
login.page.ts
import { Component, OnInit } from '@angular/core';
import { Router } from '@angular/router';
import { UserService, HelpersService, AuthService } from '../../services/';
@Component({
selector: 'login-page',
templateUrl: './login.page.html',
styleUrls: ['./login.page.scss']
})
export class LoginPage {
loginError: any;
constructor(
private router: Router,
private auth: AuthService,
public helpers: HelpersService,
) { }
login() {
this.auth.login().then((response) => {
this.router.navigate(['/']);
}).catch(error => {
this.loginError = this.helpers.notify('error connecting', 'try again', 10000);
this.helpers.notifyAction(this.loginError, this.login());
});
};
}
helpers.service.ts
import { Injectable } from '@angular/core';
import { MdSnackBar, MdSnackBarRef } from '@angular/material';
@Injectable()
export class HelpersService {
constructor(public snackBar: MdSnackBar) {}
notify(message: string, action: string, duration: number) {
return this.snackBar.open(message, action, {duration});
}
notifyAction(notification: MdSnackBarRef<any>, next) {
return notification.onAction().subscribe(() => next);
}
}