Question

当前，我在Firebase中的结果存储为true或false，并且我只想在结果为true时显示用户输出。

<html>
<tr *ngFor="let content of user">
                <td>{{content.fullname}}</td>
                <td>{{content.createdIndividualAt | date}}</td>
                <td>{{getMember(content.hasMembership)}}</td>
            </tr>
</html>



constructor(private fb: FormBuilder,
private individualSrv: IndividualService,
) {
let res = individualSrv.getAll();
res.then(result => {
  result.subscribe(async _user => {
    this.user = _user;
  });
});

   getMember(hasMembership: boolean): string {
if(hasMembership == true) {
  return 'Is member'; }
else {
  return ''
 }  
}

Answer 1

不要在添加其他元素的情况下破坏tr / td结构，只需使用ng-container，您就可以得到更清晰，更一致的输出：

<table>
    <ng-container *ngFor="let content of user">
             <tr *ngIf="content.hasMembership">
                    <td >{{content.fullname}}</td>
                    <td>{{content.createdIndividualAt | date}}</td>
                    <td>{{getMember(content.hasMembership)}}</td>
             </tr>
     </ng-container>
</table>

Ps：不要在组件中添加html标签，如果您不等待任何操作，请勿使用async！

Answer 2

您可以进行以下更改，使用ngIf进行显示，反之亦然

<html>
    <table>
        <tr *ngFor="let content of user">
            <span *ngIf="content.hasMembership">
                <td >{{content.fullname}}</td>
                <td>{{content.createdIndividualAt | date}}</td>
                <td>{{getMember(content.hasMembership)}}</td>
            </span>
        </tr>
    </table>    
</html>

如果结果为假，如何隐藏行（角度）

2 个答案: