将异步侦听器附加到click事件

Question

是否可以将异步点击事件侦听器附加到按钮。例如，如果isMobile评估为true，则我想要(click)="mobileGoogleSignIn"，而如果它为false，则我想要(click)="googleSignIn"。我可以通过复制按钮来做到这一点，但是我想知道如果没有该按钮是否可以实现。

查看

  <button type="button" class="btn btn-label btn-google" (click)="googleSignIn()" id="googleLogin">
    <label>
      <fa-icon [icon]="['fab', 'google']" size="xs"></fa-icon>
    </label> Sign in with Google
  </button>

控制器

@Component({
  selector: 'app-login-button-group',
  templateUrl: './login-button-group.component.html'
})
export class LoginButtonGroupComponent implements OnInit {   
  constructor(
    private breakpointObserver: BreakpointObserver,
  ) { }

  ngOnInit() {
    this.isMobile = this.breakpointObserver.observe([Breakpoints.Handset]);
  }

  googleSignIn() {
    ...
  }

  mobileGoogleSignIn() {
    ...
  }
}

Answer 1

实现目标的一种简单方法是在tableb_id处理程序中使用三元数。

(click)

当然，您也可以在单个处理程序中添加<button (click)="isMobile ? mobileGoogleSignIn() : googleSignIn()" ... 条件来实现此目的：

if (isMobile)

<button (click)="signIn()" ...

这两个选项都不是一个好选择-但可以实现您的追求。