kendo-ui
Kendo UI MVVM
Szukaj…
Wprowadzenie
Kendo MVVM jest jednym z frameworków JavaScript MVVM. Jest to implementacja wzorca MVVM.
Tworzy definicję danych, które chcemy wyświetlać i modyfikować (Model), znaczniki HTML tworzące strukturę dla całej strony internetowej (Widok) oraz kod JavaScript, który obsługuje dane wejściowe użytkownika, reaguje na zdarzenia i przekształca statyczne oznaczanie w elementach dynamicznych (View-Model).
Uwagi
Kendo MVVM to framework JavaScript MVVM, który implementuje wzorzec MVVM.
Podstawowe wiązanie
Zobacz:
<form id="form">
<label>First Name: <input data-bind="value: firstName" /></label>
<label>Last Name: <input data-bind="value: lastName" /></label>
<label>Gender:
<select data-bind="source: genders, value: gender"></select>
</label>
<label><input type="checkbox" data-bind="checked: agreed" /> I have read the licence agreement</label>
<button data-bind="enabled: agreed, click: register">Register</button>
<div data-bind="visible: confirmed">
Thank you for your registration, <span data-bind="text: firstName"></span> <span data-bind="text: lastName"></span>
</div>
</form>
Zobacz model:
var viewModel = kendo.observable({
firstName: "Arif",
lastName: "Rahman",
genders: ["Male", "Female"],
gender: "Male",
agreed: false,
confirmed: false,
register: function(e) {
e.preventDefault();
this.set("confirmed", true);
}
});
kendo.bind($("form"), viewModel);
Aby zobaczyć demo ODWIEDŹ PRZYKŁAD JSFIDDLER
Wiązanie paruje właściwość elementu DOM (lub widgetu) z polem lub metodą modelu widokowego. Wiązania są określane za pomocą atrybutu wiązania danych w formie nazwa powiązania: pole lub metoda modelu widoku , np. Wartość: imię . Niektóre powiązania zostały użyte w powyższym przykładzie: wartość , źródło , widoczne , włączone i kliknij .
Podpory Kendo UI MVVM wiążące się innymi właściwościami, a także: html, atr itd danych wiążą może zawierać listę oddzielonych przecinkami Wiązania np przetwarzania danych wiążą = „włączona: uzgodniono, kliknij: register”.