Angular2 - * ngFor y * ngIf en el mismo elemento produciendo error [duplicado]

Esta pregunta ya tiene una respuesta aquí:

Angular 2: dos directivas estructurales sobre el mismo elemento DOM [duplicado] 1 respuesta

Tengo una gran variedad de usuarios y quiero mostrar solo usuarios masculinos en la tabla. Así es como estoy tratando de lograr esto:

import {Component} from 'angular2/core';
import {bootstrap} from 'angular2/platform/browser';

@Component({
    selector: 'app',
    template:`
    <table>
        <tbody>
            <tr *ngFor="#user of users" *ngIf="user.gender == 'male' " >
                <td>{{user.name}}</td>
                <td>{{user.gender}}</td>
            </tr>
        </tbody>
    </table>
    `
})
export class AppCmp{
    public users = [
        {
            name: "Eesa",
            gender: "male"
        },
        {
            name: "Abdullah",
            gender: "male"
        },
        {
            name: "Javeria",
            gender: "female"
        }
    ]
}

bootstrap(AppCmp);

pero recibo el siguiente error:

EXCEPCIÓN: TypeError: no se puede leer la propiedad 'género' de indefinido

como puede ver, estoy usando * ngFor y * ngIf en el mismo elemento, es decirtr. ¿Por qué no puedo usar * ngFor y * ngIf en el mismo elemento? ¿Hay alguna otra forma de lograr esto? Re-produje el problemaaquí en plunker Puedes ver el error en la consola.

Respuestas a la pregunta(1)

Su respuesta a la pregunta