0
Kerimhanov R.
rkerimhanov@codemastersintl.com
Оглавление:
•
•
•
•

KnockoutJs?
MVVP шаблон
Почему knockoutJs?
Основные особенности knockoutJs
KnockoutJs
KnockoutJs – это JavaScript Framework, который позволяет
создавать отзывчивые и динамические UI.
Разработчиком ...
MVVM шаблон

Bindigngs

View

Commands

Events

View
Model
Ключевые концепции

Декларативная
привязка

Автоматическое
обновление

Отслеживание
зависимостей

Шаблонизация

Следует им...
Knockout vs jQuery
jQuery/js Frameworks
• Предоставляет обертку для
работы с DOM
• Достаточно низкий уровень для
работы с ...
Let’s Bind
Observables
Явная подписка на изменение
Подписываемся:

Подписываемся и отписываемся:
Computed Observables
Bindings
Допустимые типы:
•
•
•
•
•
•

Visible
Html
Text
Style
Css
Attr
Visible
Text
Html
Style
Css
Attr
Control flow statements
•
•
•
•

foreach
if
ifnot
with
Foreach
If

Ifnot
With
Form field bindigns
•
•
•
•
•
•
•
•
•
•
•

Click
Event
Submit
Enable
Disable
Value
HasFocus
Checked
Options
SelectedOption...
Extenders
Template binding
• Native templating
• String-based templating
Native templating
String-based templating
Knockout performance
http://www.knockmeout.net/
Upcoming SlideShare
Loading in...5
×

KNOCKOUTJS КАК РЕАЛИЗАЦИЯ MVVM

352

Published on

Knockout - это JavaScript библиотека, которая помогает в создании насыщенных UI и позволяет разделить модель от ее представления.

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
352
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
2
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Transcript of "KNOCKOUTJS КАК РЕАЛИЗАЦИЯ MVVM"

  1. 1. Kerimhanov R. rkerimhanov@codemastersintl.com
  2. 2. Оглавление: • • • • KnockoutJs? MVVP шаблон Почему knockoutJs? Основные особенности knockoutJs
  3. 3. KnockoutJs KnockoutJs – это JavaScript Framework, который позволяет создавать отзывчивые и динамические UI. Разработчиком этого фреймворка является он
  4. 4. MVVM шаблон Bindigngs View Commands Events View Model
  5. 5. Ключевые концепции Декларативная привязка Автоматическое обновление Отслеживание зависимостей Шаблонизация Следует иметь ввиду, что: • • • • • • Открытый фреймворк (MIT license) Написан на чистом JavaScript Легковесный (46кб сжатая версия и до 16кб при использовании HTTP compression) Не имеет зависимостей Поддерживает все основные браузеры и даже IE6+, Firefox 2+ (Desctop and Mobile) Полностью документирован
  6. 6. Knockout vs jQuery jQuery/js Frameworks • Предоставляет обертку для работы с DOM • Достаточно низкий уровень для работы с элементами и событиями на странице KnockoutJs • Обеспечивает высокоуровневый доступ для управления моделью данных и ее отображением на странице P.s. И jQuery и KnockoutJs могут быть использованы в одном месте, что бы достичь максимальной эффективности
  7. 7. Let’s Bind
  8. 8. Observables
  9. 9. Явная подписка на изменение Подписываемся: Подписываемся и отписываемся:
  10. 10. Computed Observables
  11. 11. Bindings Допустимые типы: • • • • • • Visible Html Text Style Css Attr
  12. 12. Visible
  13. 13. Text
  14. 14. Html
  15. 15. Style
  16. 16. Css
  17. 17. Attr
  18. 18. Control flow statements • • • • foreach if ifnot with
  19. 19. Foreach
  20. 20. If Ifnot
  21. 21. With
  22. 22. Form field bindigns • • • • • • • • • • • Click Event Submit Enable Disable Value HasFocus Checked Options SelectedOption UniqueName
  23. 23. Extenders
  24. 24. Template binding • Native templating • String-based templating
  25. 25. Native templating
  26. 26. String-based templating
  27. 27. Knockout performance http://www.knockmeout.net/
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×