web-dev-qa-db-fra.com

Comment puis-je actualiser une source de données de grille en utilisant angular Kendo UI

Je combine la grille Telerik Kendo avec Angular en utilisant le projet Angular Kendo UI.

J'ai le balisage suivant:

<div kendo-grid="" k-options="thingsOptions" style="height: 600px;" />

et le code suivant dans mon contrôleur:

    $scope.thingsOptions = {
        dataSource: {
            type: "json",
            transport: {
                read: "/OM/om/getAssets",
                dataType: "json"
            },
            schema: {
                model: {
                    id: "ProductID",
...

Tout cela fonctionne bien mais je voudrais forcer une actualisation de la source de données de ma grille depuis mon contrôleur. quelque chose comme

 $scope.getTasks = function() {
    $scope.thingsOptions.dataSource.read();
};

Est-ce possible de le faire à partir du contrôleur? Je pourrais toujours faire quelque chose comme

$("#taskGrid").data("kendoGrid").dataSource.read();

Dans mon contrôleur. Mais il semble un peu mal de devoir sélectionner un élément HTML sur mon contrôleur.

angularjskendo-uikendo-grid
19
David Kethel

Passez simplement une variable de portée à la directive, puis à l'intérieur de votre contrôleur, vous pouvez utiliser la variable pour appeler les méthodes de widget dont vous avez besoin.

<div kendo-grid="grid" ...></div>

<script>
  ...

  $scope.getTasks = function() {
    // scope.grid is the widget reference
    $scope.grid.refresh();
  }

  ...
</script>

Réf: http://blogs.telerik.com/kendoui/posts/14-02-26/a-few-angular-kendo-ui-best-practices

18
micjamking

Votre source de données doit être un objet kendo

$scope.thingsOptions = {
        dataSource: new kendo.data.DataSource({
                    type: "json",
                    transport: {
                        read: "/OM/om/getAssets",
                        dataType: "json"
                    },
                    schema: {
                        model: {
                            id: "ProductID",

il est alors possible d'appeler

$scope.thingsOptions.dataSource.read();
11
Yakub