angular 2: la combinación de * ngIf y * ngFor ejecuta el bucle con un último elemento indefinido
http://plnkr.co/edit/ihdAJuUcyOj5Ze93BwIQ?p=preview
import { Component } from '@angular/core';
@Component({
selector: 'my-app',
template: `
<div class="container">
<div *ngFor="let v of myValues;">
This is my value: {{v}}
</div>
<hr>
<div *ngIf="show" *ngFor="let v of myValues;">
This is my value: {{v}}
</div>
`,
})
export class AppComponent {
public user: User = {
name: 'John',
address: {
address1: '11, High Street',
postcode: '1234'
}
}
myValues = ['one','two','three'];
show = true;
public save(form: IUser, isValid: boolean) {
console.log(form, isValid);
}
}
export interface User {
name: string;
address?: {
address1?: string;
postcode?: string;
}
}
Como se puede ver en este plunkr, el segundo * ngFor se ejecutará demasiadas veces.
¿Esto es un error? ¿O simplemente tengo prohibido usar * ngFor y * ngIf juntos? No pude encontrar ninguna documentación sobre esto.