2017-09-30 5 views
0

Je montre une grille dans une boucle. Chaque fois dans la boucle, je place la source de données dans une nouvelle table qui est représentée dans un tableau mais la grille ne change pas. Les colonnes du tableau précédent sont affichées et les nouvelles colonnes du tableau ne sont jamais affichées. Le truc fou est que les données sont mises à jour UNIQUEMENT si les colonnes de la table 1 existent également dans le tableau 2 ou 3.KendoUI Angular 2 comment rafraîchir Kendo Grid

Comment puis-je obtenir la mise à jour de la grille une fois la source de données modifiée?

ChangeGrid(file){ 
this.fileData = file; 
} 

    <kendo-grid [kendoGridBinding]=fileData [height]='200' [pageSize]="10" [pageable]="true" [sortable]="true" [filterable]="false" [groupable]="false"> 
     </kendo-grid> 
+0

plunkr http://plnkr.co/edit/bBbSF9JEGZ6Ug1WKr6qa?p=preview – CodeMan03

Répondre

1

Vous remplacez essentiellement votre variable qui a la référence de KendoGridBinding et vous remplacez avec votre nouveau tableau, si la liaison est supprimée de votre variable et est remplacé par votre tableau.

Pour afficher les changements sophisticatedly, vous devez écrire votre directive contraignante sur mesure, suivez les étapes: http://www.telerik.com/kendo-angular-ui/components/grid/data-operations/data-binding/automatic-operations/

Le raccourci: Vous pouvez pousser ou pop les éléments du tableau, il conservera la liaison qui est présent dans votre variable

ChangeGrid(file){ 
this.fileData.push(file[0]); 
} 
+0

Je pense que je l'ai misworded ma question. Au lieu d'ajouter à un tableau de grille de grille j'ai besoin de la grille pour montrer toutes les nouvelles données. Chaque boucle est donc une toute nouvelle table avec différentes colonnes et en-têtes. – CodeMan03

+0

Lorsque je boucle la grille de kendo ne change jamais les colonnes, mais essayera de mapper les nouvelles données à toutes les anciennes colonnes qui peuvent avoir le même nom – CodeMan03

+0

Pour cela, vous devez écrire une directive de liaison personnalisée. http://www.telerik.com/kendo-angular-ui/components/grid/data-operations/data-binding/automatic-operations/#toc-custom-remote-directives Vous pouvez écrire 'rebind' méthode dans votre directive où vous allez modifier les données. –