Question

我正面临着一个问题，我不确定我是否可以这样做。我想根据Json密钥获得嵌套的ngIf。如果它们存在键显示黑色img并将对象写入视图的键中，如果Json键不存在则不写入（逻辑）并显示灰色img ..代码将更好地解释它我猜：

    <div *ngFor="let user of userService.users | async">
           <div *ngIf="user?.data.apps.?tag as myEmpytag">
               <img *ngIf="myEmptytag === empty(so the Json key doesn't exist)" src="greyTag.png"/>
           </div>
           <div *ngIf="user?.data.apps.?tag as myFulltag">
              <div *ngIf="myFulltag === 'something is write(so the Json key is there)">
                <span class="tag3" *ngFor="let user4 of userService4.users4 | async">{{user4.data.incidents[2].tag}}</span>
                <img src="blacktag.png"/>
             </div>
     </div>

Answer 1

代码中有太多* ngIf。您只需要一个* ngIf和一个else模板来完成您要找的工作。只需查看!user.data.apps.tag即可。如果值为null，undefined，0或“”，则否定断言将为真。

<div *ngFor="let user of userService.users | async">
    <img *ngIf="!user.data.apps.tag; else elseBlock" src="greyTag.png"/>
    <ng-template #elseBlock>
        <span class="tag3" *ngFor="let user4 of userService4.users4 | async">{{user4.data.incidents[2].tag}}</span>
        <img src="blacktag.png"/>
    </ng-template>
</div>

如果您需要制作更复杂的if语句，请在组件中创建一个函数，并在*ngIf中调用它来处理断言以避免错综复杂的HTML。

*ngIf="myAssertFunction(user)"

使用ngif

1 个答案: