Angular2 - ngIf in ngFor

Question

我想检查实际元素是否有值。

例如，我想检查巧克力是黑色还是白色。根据这个，我想显示正确的文本。

<ng-container *ngFor="let chocolate of product.getChocolates();"> 
    <md-card *ngIf="chocolate.getName() == black">IT IS BLACK</md-card> 
    <md-card *ngIf="chocolate.getName() == white">IT IS WHITE</md-card> 
</ng-container> 

如何修复代码，使其工作？

Answer 1

的问题是你错过了'（单引号）后面string这是black & white

<ng-container *ngFor="let chocolate of product.getChocolates();"> 
    <md-card *ngIf="chocolate.getName() == 'black'">IT IS BLACK</md-card> 
    <md-card *ngIf="chocolate.getName() == 'white'">IT IS WHITE</md-card> 
</ng-container> 

Answer 2

<ng-container *ngFor="let chocolate of product.getChocolates();"> 
    <md-card *ngIf="chocolate.getName() == black">IT IS BLACK</md-card> 
    <md-card *ngIf="chocolate.getName() == white">IT IS WHITE</md-card> 
</ng-container> 

修改chocolate .getName()到chocolate.getName()

Answer 3

import { Component } from '@angular/core'; 

@Component({ 
    selector: 'my-app', 
    template: `<div *ngFor="let chocolate of chocolates"> 
    <div *ngIf="chocolate.name == 'black'">IT IS BLACK</div> 
    <div *ngIf="chocolate.name == 'white'">IT IS WHITE</div> 
</div>` 
}) 
export class AppComponent{ 
    chocolates:any=[{ 
    name:'black' 
    }, 
    { 
    name:'white' 
    }]; 

    constructor() { } 
}