Enviar pesquisa
Carregar
KnockOutJS with ASP.NET MVC
•
3 gostaram
•
3,142 visualizações
LearnNowOnline
Seguir
Learn what KnockOutJS it and how to get started.
Leia menos
Leia mais
Tecnologia
Denunciar
Compartilhar
Denunciar
Compartilhar
1 de 84
Recomendados
Fast 5 Things You Can Do Now to Get Ready for the Cloud
Fast 5 Things You Can Do Now to Get Ready for the Cloud
VMware Tanzu
Just-in-time Java EE - provisioning runtimes for enterprise applications - Ja...
Just-in-time Java EE - provisioning runtimes for enterprise applications - Ja...
mfrancis
JS FAST Prototyping with AngularJS & RequireJS
JS FAST Prototyping with AngularJS & RequireJS
Yuriy Silvestrov
Prototyping app using JS and HTML5 (Ciklum Kharkiv)
Prototyping app using JS and HTML5 (Ciklum Kharkiv)
Yuriy Silvestrov
NetTantra Web Development Brochure
NetTantra Web Development Brochure
NetTantra Technologies
AngularJS : Superheroic Javascript MVW Framework
AngularJS : Superheroic Javascript MVW Framework
Edureka!
Fast prototyping apps using AngularJS, RequireJS and Twitter Bootstrap
Fast prototyping apps using AngularJS, RequireJS and Twitter Bootstrap
Yuriy Silvestrov
Øredev 2014
Øredev 2014
olataube
Recomendados
Fast 5 Things You Can Do Now to Get Ready for the Cloud
Fast 5 Things You Can Do Now to Get Ready for the Cloud
VMware Tanzu
Just-in-time Java EE - provisioning runtimes for enterprise applications - Ja...
Just-in-time Java EE - provisioning runtimes for enterprise applications - Ja...
mfrancis
JS FAST Prototyping with AngularJS & RequireJS
JS FAST Prototyping with AngularJS & RequireJS
Yuriy Silvestrov
Prototyping app using JS and HTML5 (Ciklum Kharkiv)
Prototyping app using JS and HTML5 (Ciklum Kharkiv)
Yuriy Silvestrov
NetTantra Web Development Brochure
NetTantra Web Development Brochure
NetTantra Technologies
AngularJS : Superheroic Javascript MVW Framework
AngularJS : Superheroic Javascript MVW Framework
Edureka!
Fast prototyping apps using AngularJS, RequireJS and Twitter Bootstrap
Fast prototyping apps using AngularJS, RequireJS and Twitter Bootstrap
Yuriy Silvestrov
Øredev 2014
Øredev 2014
olataube
Reactive Data Access with Spring Data
Reactive Data Access with Spring Data
VMware Tanzu
What Web Framework To Use?
What Web Framework To Use?
Kasra Khosravi
Progressive Enhancement & Mobile [Funka 2012]
Progressive Enhancement & Mobile [Funka 2012]
Aaron Gustafson
(2015년 상반기) HTML5 및 Hybrid app 최신 동향
(2015년 상반기) HTML5 및 Hybrid app 최신 동향
Wonsuk Lee
Micro-Frontends JSVidCon
Micro-Frontends JSVidCon
Amir Zuker
The Spirit of Opensource - contribution as a strategy for growth and innova...
The Spirit of Opensource - contribution as a strategy for growth and innova...
Parth Lawate
Animation And Testing In AngularJS
Animation And Testing In AngularJS
Edureka!
Accelerating Development with Organizational Opinions
Accelerating Development with Organizational Opinions
VMware Tanzu
Book scrum tutorial
Book scrum tutorial
Satya Harish
Startup eng-camp 3
Startup eng-camp 3
Jollen Chen
[DevDay 2016] The toolkit for an amazing product - Speaker: Sebastian Sussman...
[DevDay 2016] The toolkit for an amazing product - Speaker: Sebastian Sussman...
DevDay.org
Introduction to ASP.NET MVC
Introduction to ASP.NET MVC
LearnNowOnline
What's new in Silverlight 5
What's new in Silverlight 5
LearnNowOnline
Building Windows 8 Metro Style Applications Using JavaScript and HTML5
Building Windows 8 Metro Style Applications Using JavaScript and HTML5
LearnNowOnline
.Net branching and flow control
.Net branching and flow control
LearnNowOnline
Bring a Web Page Alive with jQuery
Bring a Web Page Alive with jQuery
LearnNowOnline
Working with Controllers and Actions in MVC
Working with Controllers and Actions in MVC
LearnNowOnline
Quick prototyping apps using JS - Ciklum, Vinnitsa
Quick prototyping apps using JS - Ciklum, Vinnitsa
Yuriy Silvestrov
Web API Basics
Web API Basics
LearnNowOnline
Managing site collections
Managing site collections
LearnNowOnline
SQL Server: Security
SQL Server: Security
LearnNowOnline
Expression Blend Motion & Interaction Design
Expression Blend Motion & Interaction Design
LearnNowOnline
Mais conteúdo relacionado
Mais procurados
Reactive Data Access with Spring Data
Reactive Data Access with Spring Data
VMware Tanzu
What Web Framework To Use?
What Web Framework To Use?
Kasra Khosravi
Progressive Enhancement & Mobile [Funka 2012]
Progressive Enhancement & Mobile [Funka 2012]
Aaron Gustafson
(2015년 상반기) HTML5 및 Hybrid app 최신 동향
(2015년 상반기) HTML5 및 Hybrid app 최신 동향
Wonsuk Lee
Micro-Frontends JSVidCon
Micro-Frontends JSVidCon
Amir Zuker
The Spirit of Opensource - contribution as a strategy for growth and innova...
The Spirit of Opensource - contribution as a strategy for growth and innova...
Parth Lawate
Animation And Testing In AngularJS
Animation And Testing In AngularJS
Edureka!
Accelerating Development with Organizational Opinions
Accelerating Development with Organizational Opinions
VMware Tanzu
Book scrum tutorial
Book scrum tutorial
Satya Harish
Startup eng-camp 3
Startup eng-camp 3
Jollen Chen
[DevDay 2016] The toolkit for an amazing product - Speaker: Sebastian Sussman...
[DevDay 2016] The toolkit for an amazing product - Speaker: Sebastian Sussman...
DevDay.org
Mais procurados
(11)
Reactive Data Access with Spring Data
Reactive Data Access with Spring Data
What Web Framework To Use?
What Web Framework To Use?
Progressive Enhancement & Mobile [Funka 2012]
Progressive Enhancement & Mobile [Funka 2012]
(2015년 상반기) HTML5 및 Hybrid app 최신 동향
(2015년 상반기) HTML5 및 Hybrid app 최신 동향
Micro-Frontends JSVidCon
Micro-Frontends JSVidCon
The Spirit of Opensource - contribution as a strategy for growth and innova...
The Spirit of Opensource - contribution as a strategy for growth and innova...
Animation And Testing In AngularJS
Animation And Testing In AngularJS
Accelerating Development with Organizational Opinions
Accelerating Development with Organizational Opinions
Book scrum tutorial
Book scrum tutorial
Startup eng-camp 3
Startup eng-camp 3
[DevDay 2016] The toolkit for an amazing product - Speaker: Sebastian Sussman...
[DevDay 2016] The toolkit for an amazing product - Speaker: Sebastian Sussman...
Semelhante a KnockOutJS with ASP.NET MVC
Introduction to ASP.NET MVC
Introduction to ASP.NET MVC
LearnNowOnline
What's new in Silverlight 5
What's new in Silverlight 5
LearnNowOnline
Building Windows 8 Metro Style Applications Using JavaScript and HTML5
Building Windows 8 Metro Style Applications Using JavaScript and HTML5
LearnNowOnline
.Net branching and flow control
.Net branching and flow control
LearnNowOnline
Bring a Web Page Alive with jQuery
Bring a Web Page Alive with jQuery
LearnNowOnline
Working with Controllers and Actions in MVC
Working with Controllers and Actions in MVC
LearnNowOnline
Quick prototyping apps using JS - Ciklum, Vinnitsa
Quick prototyping apps using JS - Ciklum, Vinnitsa
Yuriy Silvestrov
Web API Basics
Web API Basics
LearnNowOnline
Managing site collections
Managing site collections
LearnNowOnline
SQL Server: Security
SQL Server: Security
LearnNowOnline
Expression Blend Motion & Interaction Design
Expression Blend Motion & Interaction Design
LearnNowOnline
Getting Started with .NET
Getting Started with .NET
LearnNowOnline
Building a custom column office 365 app - lessons learnt from building the K...
Building a custom column office 365 app - lessons learnt from building the K...
Nimrod Geva
New in the Visual Studio 2012 IDE
New in the Visual Studio 2012 IDE
LearnNowOnline
Object oriented techniques
Object oriented techniques
LearnNowOnline
Building share point apps with angularjs
Building share point apps with angularjs
Ahmed Elharouny
Angular JS Training Agenda
Angular JS Training Agenda
RMS Software Technologies
WPF Binding
WPF Binding
LearnNowOnline
GDPR and EA - Commissioning a web site part 7 - Choosing a web site developer
GDPR and EA - Commissioning a web site part 7 - Choosing a web site developer
Allen Woods
The jQuery Library
The jQuery Library
LearnNowOnline
Semelhante a KnockOutJS with ASP.NET MVC
(20)
Introduction to ASP.NET MVC
Introduction to ASP.NET MVC
What's new in Silverlight 5
What's new in Silverlight 5
Building Windows 8 Metro Style Applications Using JavaScript and HTML5
Building Windows 8 Metro Style Applications Using JavaScript and HTML5
.Net branching and flow control
.Net branching and flow control
Bring a Web Page Alive with jQuery
Bring a Web Page Alive with jQuery
Working with Controllers and Actions in MVC
Working with Controllers and Actions in MVC
Quick prototyping apps using JS - Ciklum, Vinnitsa
Quick prototyping apps using JS - Ciklum, Vinnitsa
Web API Basics
Web API Basics
Managing site collections
Managing site collections
SQL Server: Security
SQL Server: Security
Expression Blend Motion & Interaction Design
Expression Blend Motion & Interaction Design
Getting Started with .NET
Getting Started with .NET
Building a custom column office 365 app - lessons learnt from building the K...
Building a custom column office 365 app - lessons learnt from building the K...
New in the Visual Studio 2012 IDE
New in the Visual Studio 2012 IDE
Object oriented techniques
Object oriented techniques
Building share point apps with angularjs
Building share point apps with angularjs
Angular JS Training Agenda
Angular JS Training Agenda
WPF Binding
WPF Binding
GDPR and EA - Commissioning a web site part 7 - Choosing a web site developer
GDPR and EA - Commissioning a web site part 7 - Choosing a web site developer
The jQuery Library
The jQuery Library
Mais de LearnNowOnline
Windows 8: Shapes and Geometries
Windows 8: Shapes and Geometries
LearnNowOnline
SQL: Permissions and Data Protection
SQL: Permissions and Data Protection
LearnNowOnline
Attributes, reflection, and dynamic programming
Attributes, reflection, and dynamic programming
LearnNowOnline
Asynchronous Programming
Asynchronous Programming
LearnNowOnline
WPF: Working with Data
WPF: Working with Data
LearnNowOnline
A tour of SQL Server
A tour of SQL Server
LearnNowOnline
Introducing LINQ
Introducing LINQ
LearnNowOnline
Generics
Generics
LearnNowOnline
Object-Oriented JavaScript
Object-Oriented JavaScript
LearnNowOnline
SharePoint Document Management
SharePoint Document Management
LearnNowOnline
SharePoint: Introduction to InfoPath
SharePoint: Introduction to InfoPath
LearnNowOnline
Web API HTTP Pipeline
Web API HTTP Pipeline
LearnNowOnline
Sql 2012 development and programming
Sql 2012 development and programming
LearnNowOnline
The Entity Data Model
The Entity Data Model
LearnNowOnline
Introducing the Entity Framework
Introducing the Entity Framework
LearnNowOnline
Creating a User Interface
Creating a User Interface
LearnNowOnline
Using The .NET Framework
Using The .NET Framework
LearnNowOnline
.NET Variables and Data Types
.NET Variables and Data Types
LearnNowOnline
Mais de LearnNowOnline
(18)
Windows 8: Shapes and Geometries
Windows 8: Shapes and Geometries
SQL: Permissions and Data Protection
SQL: Permissions and Data Protection
Attributes, reflection, and dynamic programming
Attributes, reflection, and dynamic programming
Asynchronous Programming
Asynchronous Programming
WPF: Working with Data
WPF: Working with Data
A tour of SQL Server
A tour of SQL Server
Introducing LINQ
Introducing LINQ
Generics
Generics
Object-Oriented JavaScript
Object-Oriented JavaScript
SharePoint Document Management
SharePoint Document Management
SharePoint: Introduction to InfoPath
SharePoint: Introduction to InfoPath
Web API HTTP Pipeline
Web API HTTP Pipeline
Sql 2012 development and programming
Sql 2012 development and programming
The Entity Data Model
The Entity Data Model
Introducing the Entity Framework
Introducing the Entity Framework
Creating a User Interface
Creating a User Interface
Using The .NET Framework
Using The .NET Framework
.NET Variables and Data Types
.NET Variables and Data Types
Último
Moving Beyond Passwords: FIDO Paris Seminar.pdf
Moving Beyond Passwords: FIDO Paris Seminar.pdf
LoriGlavin3
Advanced Computer Architecture – An Introduction
Advanced Computer Architecture – An Introduction
Dilum Bandara
Transcript: New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
BookNet Canada
TeamStation AI System Report LATAM IT Salaries 2024
TeamStation AI System Report LATAM IT Salaries 2024
Lonnie McRorey
Ensuring Technical Readiness For Copilot in Microsoft 365
Ensuring Technical Readiness For Copilot in Microsoft 365
2toLead Limited
Digital Identity is Under Attack: FIDO Paris Seminar.pptx
Digital Identity is Under Attack: FIDO Paris Seminar.pptx
LoriGlavin3
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
BookNet Canada
A Deep Dive on Passkeys: FIDO Paris Seminar.pptx
A Deep Dive on Passkeys: FIDO Paris Seminar.pptx
LoriGlavin3
How AI, OpenAI, and ChatGPT impact business and software.
How AI, OpenAI, and ChatGPT impact business and software.
Curtis Poe
TrustArc Webinar - How to Build Consumer Trust Through Data Privacy
TrustArc Webinar - How to Build Consumer Trust Through Data Privacy
TrustArc
Hyperautomation and AI/ML: A Strategy for Digital Transformation Success.pdf
Hyperautomation and AI/ML: A Strategy for Digital Transformation Success.pdf
Precisely
Commit 2024 - Secret Management made easy
Commit 2024 - Secret Management made easy
Alfredo García Lavilla
unit 4 immunoblotting technique complete.pptx
unit 4 immunoblotting technique complete.pptx
BkGupta21
Streamlining Python Development: A Guide to a Modern Project Setup
Streamlining Python Development: A Guide to a Modern Project Setup
Florian Wilhelm
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)
Mark Simos
Unraveling Multimodality with Large Language Models.pdf
Unraveling Multimodality with Large Language Models.pdf
Alex Barbosa Coqueiro
SIP trunking in Janus @ Kamailio World 2024
SIP trunking in Janus @ Kamailio World 2024
Lorenzo Miniero
Scanning the Internet for External Cloud Exposures via SSL Certs
Scanning the Internet for External Cloud Exposures via SSL Certs
Rizwan Syed
The Fit for Passkeys for Employee and Consumer Sign-ins: FIDO Paris Seminar.pptx
The Fit for Passkeys for Employee and Consumer Sign-ins: FIDO Paris Seminar.pptx
LoriGlavin3
DSPy a system for AI to Write Prompts and Do Fine Tuning
DSPy a system for AI to Write Prompts and Do Fine Tuning
Lars Bell
Último
(20)
Moving Beyond Passwords: FIDO Paris Seminar.pdf
Moving Beyond Passwords: FIDO Paris Seminar.pdf
Advanced Computer Architecture – An Introduction
Advanced Computer Architecture – An Introduction
Transcript: New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
TeamStation AI System Report LATAM IT Salaries 2024
TeamStation AI System Report LATAM IT Salaries 2024
Ensuring Technical Readiness For Copilot in Microsoft 365
Ensuring Technical Readiness For Copilot in Microsoft 365
Digital Identity is Under Attack: FIDO Paris Seminar.pptx
Digital Identity is Under Attack: FIDO Paris Seminar.pptx
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
A Deep Dive on Passkeys: FIDO Paris Seminar.pptx
A Deep Dive on Passkeys: FIDO Paris Seminar.pptx
How AI, OpenAI, and ChatGPT impact business and software.
How AI, OpenAI, and ChatGPT impact business and software.
TrustArc Webinar - How to Build Consumer Trust Through Data Privacy
TrustArc Webinar - How to Build Consumer Trust Through Data Privacy
Hyperautomation and AI/ML: A Strategy for Digital Transformation Success.pdf
Hyperautomation and AI/ML: A Strategy for Digital Transformation Success.pdf
Commit 2024 - Secret Management made easy
Commit 2024 - Secret Management made easy
unit 4 immunoblotting technique complete.pptx
unit 4 immunoblotting technique complete.pptx
Streamlining Python Development: A Guide to a Modern Project Setup
Streamlining Python Development: A Guide to a Modern Project Setup
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)
Unraveling Multimodality with Large Language Models.pdf
Unraveling Multimodality with Large Language Models.pdf
SIP trunking in Janus @ Kamailio World 2024
SIP trunking in Janus @ Kamailio World 2024
Scanning the Internet for External Cloud Exposures via SSL Certs
Scanning the Internet for External Cloud Exposures via SSL Certs
The Fit for Passkeys for Employee and Consumer Sign-ins: FIDO Paris Seminar.pptx
The Fit for Passkeys for Employee and Consumer Sign-ins: FIDO Paris Seminar.pptx
DSPy a system for AI to Write Prompts and Do Fine Tuning
DSPy a system for AI to Write Prompts and Do Fine Tuning
KnockOutJS with ASP.NET MVC
1.
KnockoutJS with ASP.NET
MVC Part 1 Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
2.
Overview
Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
3.
Overview • What is
KnockOutJS and why do I care? Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
4.
Overview • What is
KnockOutJS and why do I care? • Getting Started Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
5.
Overview • What is
KnockOutJS and why do I care? • Getting Started • Observables Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
6.
Overview •
What is KnockOutJS and why do I care? • Getting Started • Observables • Bindings Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
7.
Overview •
What is KnockOutJS and why do I care? • Getting Started • Observables • Bindings • Templating Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
8.
Overview •
What is KnockOutJS and why do I care? • Getting Started • Observables • Bindings • Templating • Customizing KnockOutJS Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
9.
What’s KnockoutJS and
why do I care? Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
10.
What’s KnockoutJS and
why do I care? KnockoutJS (KO for short) allows: Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
11.
What’s KnockoutJS and
why do I care? KnockoutJS (KO for short) allows: • Rich, responsive user interfaces Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
12.
What’s KnockoutJS and
why do I care? KnockoutJS (KO for short) allows: • Rich, responsive user interfaces • Dependency tracking Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
13.
What’s KnockoutJS and
why do I care? KnockoutJS (KO for short) allows: • Rich, responsive user interfaces • Dependency tracking • Declarative Bindings Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
14.
What’s KnockoutJS and
why do I care? KnockoutJS (KO for short) allows: • Rich, responsive user interfaces • Dependency tracking • Declarative Bindings • Self-contained JavaScript library (14Kb with gZip!) Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
15.
What’s KnockoutJS and
why do I care? KnockoutJS (KO for short) allows: • Rich, responsive user interfaces • Dependency tracking • Declarative Bindings • Self-contained JavaScript library (14Kb with gZip!) • Supports mainstream browsers (IE6+, FF 2+, Chrome, Safari and others) Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
16.
What’s KnockoutJS and
why do I care? KnockoutJS (KO for short) allows: • Rich, responsive user interfaces • Dependency tracking • Declarative Bindings • Self-contained JavaScript library (14Kb with gZip!) • Supports mainstream browsers (IE6+, FF 2+, Chrome, Safari and others) • MVVM for JSON data Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
17.
What is KnockoutJS
Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
18.
What is KnockoutJS •
Declarative Bindings Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
19.
What is KnockoutJS •
Declarative Bindings • Automatic UI Refresh Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
20.
What is KnockoutJS •
Declarative Bindings • Automatic UI Refresh • Dependency Tracking Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
21.
What is KnockoutJS •
Declarative Bindings • Automatic UI Refresh • Dependency Tracking • Templating Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
22.
What is KnockoutJS •
Declarative Bindings • Automatic UI Refresh • Dependency Tracking • Templating • No Dependencies! Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
23.
What isn’t KnockOutJS
Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
24.
What isn’t KnockOutJS •
Not a replacement for jQuery Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
25.
What isn’t KnockOutJS •
Not a replacement for jQuery • Not a Prototype for JavaScript Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
26.
What isn’t KnockOutJS •
Not a replacement for jQuery • Not a Prototype for JavaScript … <head> <script type=“text/javascript” src=“jquery.min.js” /> <script type=“text/javascript” src=“knockout.min.js” /> </head> … Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
27.
3 Core Features
of Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
28.
3 Core Features
of 1. Observables and dependency tracking Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
29.
3 Core Features
of 1. Observables and dependency tracking 2. Declarative bindings Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
30.
3 Core Features
of 1. Observables and dependency tracking 2. Declarative bindings 3. Templating Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
31.
Model-View-View-Model
Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
32.
Model-View-View-Model MVVM: Design pattern
for building user interfaces Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
33.
Model-View-View-Model MVVM: Design pattern
for building user interfaces • Model – Data of your application Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
34.
Model-View-View-Model MVVM: Design pattern
for building user interfaces • Model – Data of your application • View Model – Entity (field) structure of your data Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
35.
Model-View-View-Model MVVM: Design pattern
for building user interfaces • Model – Data of your application • View Model – Entity (field) structure of your data • View – UI that represents the View Model and the interactions within it Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
36.
Overview
Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
37.
Overview • What is
KnockOutJS and why do I care? Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
38.
Overview • What is
KnockOutJS and why do I care? • Getting Started Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
39.
Overview • What is
KnockOutJS and why do I care? • Getting Started • Observables Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
40.
Overview •
What is KnockOutJS and why do I care? • Getting Started • Observables • Bindings Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
41.
Overview •
What is KnockOutJS and why do I care? • Getting Started • Observables • Bindings • Templating Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
42.
Overview •
What is KnockOutJS and why do I care? • Getting Started • Observables • Bindings • Templating • Customizing KnockOutJS Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
43.
Getting Started
Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
44.
Getting Started • If
using ASP.NET MVC 4 Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
45.
Getting Started • If
using ASP.NET MVC 4 • Good news, it’s part of the template! Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
46.
Getting Started • If
using ASP.NET MVC 4 • Good news, it’s part of the template! • Start a new MVC 4 project in Visual Studio Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
47.
Getting Started • If
using ASP.NET MVC 4 • Good news, it’s part of the template! • Start a new MVC 4 project in Visual Studio • If using some other technology Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
48.
Getting Started • If
using ASP.NET MVC 4 • Good news, it’s part of the template! • Start a new MVC 4 project in Visual Studio • If using some other technology • Download KO from http://knockoutjs.com Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
49.
Update KO and
add Knockout.Mapping Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
50.
Update KO and
add Knockout.Mapping • Knockout.mapping is an plugin to KO Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
51.
Update KO and
add Knockout.Mapping • Knockout.mapping is an plugin to KO • Need latest version of KO for items like $index Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
52.
Update KO and
add Knockout.Mapping • Knockout.mapping is an plugin to KO • Need latest version of KO for items like $index • https://github.com/SteveSanderson/knockout/downloads Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
53.
Update KO and
add Knockout.Mapping • Knockout.mapping is an plugin to KO • Need latest version of KO for items like $index • https://github.com/SteveSanderson/knockout/downloads In Visual Studio, open: Tools > Library Package Manager > Package Manager Console Type: Install-Package knockout.mapping Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
54.
Overview
Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
55.
Overview • What is
KnockOutJS and why do I care? Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
56.
Overview • What is
KnockOutJS and why do I care? • Getting Started Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
57.
Overview • What is
KnockOutJS and why do I care? • Getting Started • Observables Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
58.
Overview •
What is KnockOutJS and why do I care? • Getting Started • Observables • Bindings Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
59.
Overview •
What is KnockOutJS and why do I care? • Getting Started • Observables • Bindings • Templating Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
60.
Overview •
What is KnockOutJS and why do I care? • Getting Started • Observables • Bindings • Templating • Customizing KnockOutJS Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
61.
Observables
Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
62.
Observables • One of
the 3 cores of KnockoutJS Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
63.
Observables • One of
the 3 cores of KnockoutJS • Allows reading and writing values Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
64.
Observables • One of
the 3 cores of KnockoutJS • Allows reading and writing values • Allows subscriptions (for notifying of a change) Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
65.
Observables: Example
Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
66.
Observables: Example • View
Model in KO is easy, just declare your view model like the example below Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
67.
Observables: Example • View
Model in KO is easy, just declare your view model like the example below … var viewModel = { productName: ‘Widget’, productCat: ‘Other’ }; … Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
68.
Observables: Example • View
Model in KO is easy, just declare your view model like the example below … var viewModel = { productName: ‘Widget’, productCat: ‘Other’ }; … The product is <span data-bind=“text: productName”></span> Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
69.
Computed Observables
Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
70.
Computed Observables • Allows
customizations to View Model fields Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
71.
Computed Observables • Allows
customizations to View Model fields function productsViewModel () { this.productName = ko.observable(‘Widget’); this.productModel = ko.observable(‘12345’); this.productDisplay = ko.computed(function() { return this.productName() + “ ( “ + this.productModel ()+ “ ) “; }, this); } Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
72.
Computed Observables • Allows
customizations to View Model fields function productsViewModel () { this.productName = ko.observable(‘Widget’); this.productModel = ko.observable(‘12345’); this.productDisplay = ko.computed(function() { return this.productName() + “ ( “ + this.productModel ()+ “ ) “; }, this); } The result is: Widget (12345) Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
73.
Observable Arrays
Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
74.
Observable Arrays • Used
for a collection of items Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
75.
Observable Arrays • Used
for a collection of items var myArray = ko.observableArray ([ { name: “Windows”, category: “OS” }, { name: “Office”, category: “Application” } ]); Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
76.
Overview
Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
77.
Overview • What is
KnockOutJS and why do I care? Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
78.
Overview • What is
KnockOutJS and why do I care? • Getting Started Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
79.
Overview • What is
KnockOutJS and why do I care? • Getting Started • Observables Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
80.
Overview •
What is KnockOutJS and why do I care? • Getting Started • Observables • Bindings Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
81.
Overview •
What is KnockOutJS and why do I care? • Getting Started • Observables • Bindings • Templating Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
82.
Overview •
What is KnockOutJS and why do I care? • Getting Started • Observables • Bindings • Templating • Customizing KnockOutJS Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
83.
Learn More!
Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
84.
Learn More! • This
is an excerpt from a larger course. Visit www.learnnowonline.com for the full details! Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
Notas do Editor
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
DEMO: rest of section\n