Ceci est une ancienne révision du document !
Kendo UI
Cette page s'intéresse à l'utilisation de Kendo UI avec AngularJS.
TypeScript Definition : tsd query -r -o -a install kendo-ui. Ajouter la ligne au début du fichier: / <reference path=“../../../typings/kendo-ui/kendo-ui.d.ts”/>.
===== Kendo Dropdown List =====
==== Méthode 1 ====
La première méthode démontre l'utilisation d'attributs Kendo pour le <select>.
Dans le fichier HTML:
<code html>
<select kendo-drop-down-list
k-option-label=“'Select a computer…'”
k-data-text-field=“'name'”
k-data-value-field=“'id'”
k-data-source=“vm.computers”>
</select>
</code>
Dans le fichier JS:
<code javascript>
vm.computers = [
{ id: 1, name: “MacBook Pro” },
{ id: 2, name: “MacBook Air” },
{ id: 3, name: “Mac Pro” }
];
</code>
==== Méthode 2 ====
La deuxième méthode démontre l'utilisation d'options pour le <select>''.
Dans le fichier HTML:
<code html>
<select name=“” id=“” kendo-drop-down-list
k-options=“vm.computerOptions”>
</select>
</code>
Dans le fichier JS:
<code javascript>
vm.computerOptions = {
dataSource: {
data: [
{ id: 1, name: “MacBook Pro” },
{ id: 2, name: “MacBook Air” },
{ id: 3, name: “Mac Pro” }
]
},
dataTextField: 'name',
dataValueField: 'id',
optionLabel: 'Select a computer…'
};
</code>
====== Angular acces ======
angular.element(“[kendo-grid]”).data(“kendoGrid”)._data.filter(function(item) {return item.nom === “afsdf”; })
====== Sources ======
* Kendo UI and AngularJS from Scratch