angular 2: combining *ngIf and *ngFor executes loop with a last undefined item

Question

http://plnkr.co/edit/ihdAJuUcyOj5Ze93BwIQ?p=preview

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

@Component({
  selector: \'my-app\',
  template: `
    


        
                      

              相关标签:
       
      

Answer 1

You can also use this

<template let-v ngFor [ngForOf]="myValues">
        <div *ngIf="show">
          This is my value: {{v}}
        </div>
</template>

Answer 2

*ngIf and *ngFor on the same element are not supported.
As workaround you can use:

update (2.0.0)

  <ng-container *ngIf="show">
    <div *ngFor="let v of myValues;">
      This is my value: {{v}}
    </div>
  </ng-container>

original

  <template [ngIf]="show">
    <div *ngFor="let v of myValues;">
      This is my value: {{v}}
    </div>
  </template>