Angular 11三元表达式*ngIF

Question

我有点卡住了。我正在尝试使用三元表达式编写*ngIf-else语句目标是写*ngIf如果用户登录了徽标，则a href将指向一个Url，如果未登录，则href将指向另一个Url。

https://stackblitz.com/edit/angular-ivy-oyyuxu?file=src%2Fapp%2Fapp.component.html

感谢

Answer 1

您可以在如下模板中使用三元表达式：

<a [href]="auth.loggedInUser ? 'http://userLogged' : 'http://userNotLogged'">

Answer 2

在不确定如何实现登录的情况下，我更改了您的代码以工作：

// app.component.ts 
export class AppComponent {
name = 'Angular ' + VERSION.major;
public auth: any = { loggedInUser: false };
}
// app.component.html
<a *ngIf="!auth.loggedInUser">
<img id="nav-logo"
src="https://icm.aexp-static.com/shopamex/img/global-images/Parks_3.jpg"/>
</a>

然而，一个简单的登录看起来更像这样：

import { Component } from '@angular/core';
import { Observable, Subscription } from 'rxjs';
@Component({
selector: 'my-app',
templateUrl: './app.component.html'
})
export class AppComponent {
public auth: { loggedInUser: boolean };
public constructor(protected authService: AuthService) {
let login$: Observable<boolean> = this.authService.Login();
let sub: Subscription = login$.subscribe((success:boolean) => {
this.auth.loggedInUser = success;
});
}
}