12
V2.0 1 /21 MVVM Pattern and Knockoutjs Hà Nội, tháng 01 năm 2014 Present : Nguyen Manh Toan 04/01/2014

TVT_Training. MVVM Pattern and Knockoutjs.v20140104.2

Embed Size (px)

DESCRIPTION

TVT_Training. MVVM Pattern and Knockoutjs.v20140104.2

Citation preview

Data Warehousing Solutions for SAPPresent : Nguyen Manh Toan
Ngày sinh: 13/11/1989
Chc v: Developer
Môn ging dy: Lp trình .NET, WEB, Tin hc vn phòng.
Email: [email protected]
SDT: 01696959732
2+ nm lp trình Web, C#.
2012- 2013: Tham gia phát trin các d án ASP.NET ti NITECO cho th trng châu Âu.
Kinh nghim ào to:
2012: Tham gia phát trin các gói hc liu cho phòng Elearning, BKIndex
2012-2013: Tr ging các khóa hc cho Elearning , BKIndex.
GING VIÊN DOANH NGHIP VÀ I HC CÙNG DY
*
Hello world
V2.0 * /21
What? MVVM = Model – View – ViewModel
Là 1 architechtural pattern (mu thit k h thng) c gii thiu ln u tiên bi Martin Fowler (Microsoft specialization)
Where? c áp dng cho các nn tng công ngh nh WPF, Silverlight, Knockoutjs, Kendo MVVM, Angularjs, …
Why?
Vi nhng chc nng web có nhiu nghip v, tng tác nhiu, vi ngi dùng, không reload, … (Single page application. vd: master-detail trên 1 page)
*
1. MVVM Pattern- How?
View: tng t View trong MVC, là giao din hin th d liu và nhn tng tác ca ngi dùng.
Model: tng t Model trong MVC, là i tng giúp truy xut và thao tác trên d liu thc s.
*
Key concepts:
Ko.applyBindings(): thc hin apply Knockout model (KO) cho document.
data-bind: thc hin binding html element vào 1 thuc tính ca i tng.
ko.observable(): khai báo thuc tính c “giám sát”
text, value: dùng trên view, bind d liu.
computed: dùng khai báo thuc tính là kt qu ca mt biu thc tính toán.
*
V2.0 * /21
foreach: (dùng trên view) lp qua mng hoc collection.
$parent, $parents, $root, $index, $data: (dùng trên View, ging selector trong jQuery)
visible, enable
Nghiên cu on chng trình sau:
Chia thành 2, 3 i. Mi i ci tin chng trình bng cách thêm chc nng:
Mi task, thêm 1 delete link bên phi: khi click thì delete task ó.
Thêm 1 checkbox trên cùng thc hin vic n/hin các task c mark done.
*
Bài tp v nhà:
B1: Thêm chc nng giúp ngi dùng nhp vào deadline ca mi task. Và hin th deadline ó trên list task. Task nào quá deadline mà cha thc hin thì bôi . (code thành 1 web page, ko dùng jsfiddle)
B2: Save d liu ó vào database (t thit k)
B3: S dng MVC thc hin các thao tác load và save d liu database.
Link tham kho: