2016-01-20 2 views
3

Pourquoi this example sur TypeSctipt avec ag-grid ne fonctionne pas?EXCEPTION: Aucune annotation de directive trouvée sur AgGridNg2

Il y a erreur dans la console:

EXCEPTION: No Directive annotation found on AgGridNg2 

Code de cars.ts avec ligne poblem:

import {Component, View} from 'angular2/angular2' 
import {CarsService} from './cars_service' 

@Component({ 
    selector: 'cars', 
    bindings: [CarsService] 
}) 
@View({ 
    template: ` 
     <ag-grid-ng2 id="cars" class="ag-fresh" 
     [column-defs]="columnDefs" [row-data]="rowData"> 
     </ag-grid-ng2> 
    `, 

    //////////////////////////////////// 
    // Problem at this line 
    //////////////////////////////////// 
    directives: [ag.grid.AgGridNg2] 

}) 
export class Cars { 

    private columnDefs: Object[]; 
    private rowData: Object[]; 

    constructor(service: CarsService) { 
    this.columnDefs = [ 
     { headerName: "Make", field: "make" }, 
     { headerName: "Model", field: "model" }, 
     { headerName: "Price", field: "price" } 
    ]; 

    service.getCars().subscribe(
    (res: Response) => { 
     this.rowData = res.json(); 
     //console.log(this.rowData); 
     // TODO: Refresh table 
    }); 
    } 
} 

Dois-je importer AgGridNg2 ou non, et comment le faire? Ou peut-être la version actuelle de Angular2 Beta est cassée?

+0

Ceci est dû à la mise à jour angulaire. Utilisez la version Angular beta.0 et n'utilisez pas la version bêta angulaire beta.1. Ce plunker est obsolète, essayez de trouver une version plus récente ou réécrivez-la. –

Répondre

4

J'ai regardé votre plunkr. Dans les versions bêta, angular2/angular2 est maintenant angular2/core.

Cela dit, il semble que vous n'initialisiez pas correctement la grille-réseau. Vous devriez essayer quelque chose comme ça:

ag.grid.initialiseAgGridWithAngular2({ core: core }); 

bootstrap(App, [ 
    HTTP_BINDINGS, 
    ROUTER_BINDINGS, 
    bind(ROUTER_PRIMARY_COMPONENT).toValue(App), 
    bind(LocationStrategy).toClass(HashLocationStrategy) 
]); 

et de supprimer ce bloc de votre fichier index.html:

System.import("angular2/angular2").then(function(ng2) { 
    ag.grid.initialiseAgGridWithAngular2(ng2); 
}); 

Voici un échantillon d'utilisation de grille ag avec tapuscrit: https://github.com/helix46/ag-grid-angular2-beta-ts. Voici le fichier concernant la configuration: https://github.com/helix46/ag-grid-angular2-beta-ts/blob/master/src/boot.ts.

espérons qu'il vous aidera, Thierry