2016-01-30 37 views
6

Durante il gioco con Angular 2, ho riscontrato un problema: apparentemente non posso inserire due direttive strutturali (ngFor, ngIf) sullo stesso elemento DOM.
In Angular 1 questo funzionava. Per example:Angolare 2 - Due direttive strutturali sullo stesso elemento DOM

<div ng-repeat="item in items" ng-if="$even">{{item}}</div> 

quando provo qualcosa di simile con Angular 2:

@Component({ 
    selector: 'my-app', 
    providers: [], 
    template: ` 
    <div> 
     <div *ngFor="#item of items; #e = even" *ngIf="e">{{item}}</div> 

    </div> 
    `, 
    directives: [] 
}) 
export class App { 
    constructor() { 
    this.items = ["a","b","c"] 
    } 
} 

Non succede nulla. Neanche un errore.

Se metto la direttiva ngIf su un elemento figlio, it works:

<div *ngFor="#item of items; #e = even"><div *ngIf="e">{{item}}</div></div> 

Ma il problema è che non voglio aggiungere un elemento figlio solo per questo. Se, ad esempio, si tratta di un tag <tr> all'interno di una tabella, l'aggiunta di uno div all'interno renderà il DOM strano.

So che Angular 2 è ancora in beta, ma mi chiedo se è un bug, una funzionalità o forse c'è un modo non documentato per ottenere ciò che voglio.

+2

AFAIK questo non è supportato. Tuttavia, l'utilizzo del modulo esplicito '