简体   繁体   中英

How to use *ngIf in *ngFor in Angular 7?

I have multiple items in my DocumentModel document, which I all want to show except of 'content'. I already tried to exclude it by checking the name of the item, but it's showing it anyways:

<p *ngFor="let item of (document | keyvalue)">
    <b *ngIf="item.key != 'content'">{{item.key}}:</b> {{item.value}}
</p>

I also tried using content without '', which is also not working.

How can I make something like if(!key.equals("content")) as in Java?

Document Model

export class DocumentModel 
{ 
    messageType: string; 
    content: string; 
    failed: boolean; 
    string1: string; 
    string2: string; 
}
You can create pipe to access key

import { PipeTransform, Pipe } from '@angular/core';

@Pipe({name: 'keys'})
export class KeysPipe implements PipeTransform {
  transform(value, args:string[]) : any {
    let keys = [];
    for (let key in value) {
      keys.push({key: key, value: value[key]});
    }
    return keys;
  }
}
html:
<span *ngFor="let item of content | keys">           
   <b *ngIf="item.key != 'content'">{{item.key}}:</b> {{item.value}}
</span>

Or

Write filter for content data from list.

Here is your initial code:

<p *ngFor="let item of (document | keyvalue)">
    <b *ngIf="item.key != 'content'">{{item.key}}:</b> {{item.value}}
</p>

But if I look at the *ngFor it seems that item can be a document or a keyvalue . So my question is: Are you sure that document and keyvalue has the field key ?

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM