我正在使用MDC Web组件构建自动完成输入。我有一个输入文本字段和一个菜单。您可以看到codeandox here。 我正在显示有关focusin事件的菜单,但是如果我开始在输入字段中写入内容,则菜单将立即关闭。
@Injectable({ providedIn: 'root' })
export class AuthGuard implements Canactivate {
constructor(private authService: AuthService,private router: Router) {}
canactivate(
route: activatedRoutesnapshot,state: RouterStatesnapshot
):
| boolean
| UrlTree
| Promise<boolean | UrlTree>
| Observable<boolean | UrlTree> {
return this.authService.user.pipe(
map((user) => {
const isAuth = !!user;
if (isAuth) {
return true;
}
return this.router.createUrlTree(['/auth']);
})
);
}
}
我认为这是由于菜单默认行为在触发菜单外单击时关闭。这里的问题还在于焦点是来自文本字段的第一个菜单项。防止这种情况的方法是什么,并打开菜单直到焦点消失在输入字段上?