Preview:
DESCRIPTION
Citation preview
- KnockoutJS 14512
- Knockout Hands-on COPYRIGHT 2014 PLUGRAM, INC. Twitter
@tan_go238 JavaPHP Curry 14512
- Knockout Hands-on COPYRIGHT 2014 PLUGRAM, INC. TODO 14512
- Knockout Hands-on COPYRIGHT 2014 PLUGRAM, INC. 14512
- Knockout Hands-on COPYRIGHT 2014 PLUGRAM, INC. 14512
- Knockout Hands-on COPYRIGHT 2014 PLUGRAM, INC.
http://yeoman.io/ 14512
- Knockout Hands-on COPYRIGHT 2014 PLUGRAM, INC. Yeoman npm
install -g yo npm install -g generator-webapp Grunt Bower
14512
- Knockout Hands-on COPYRIGHT 2014 PLUGRAM, INC. mkdir
knockout-handson cd knockout-handson yo webapp 14512
- Knockout Hands-on COPYRIGHT 2014 PLUGRAM, INC. 14512
- Knockout Hands-on COPYRIGHT 2014 PLUGRAM, INC. grunt serve
14512
- Knockout Hands-on COPYRIGHT 2014 PLUGRAM, INC. KnockoutJS bower
install knockoutjs --save cd bower_components/knockoutjs npm
install ls build/output/ knockout-latest.debug.js
knockout-latest.js 14512
- Knockout Hands-on COPYRIGHT 2014 PLUGRAM, INC. KnockoutJS # cd
../../ # app/index.html edit app/index.html 14512
- Knockout Hands-on COPYRIGHT 2014 PLUGRAM, INC. KnockoutJS
14512
- Knockout Hands-on COPYRIGHT 2014 PLUGRAM, INC. 14512
- Knockout Hands-on COPYRIGHT 2014 PLUGRAM, INC. # app/index.html
edit app/index.html HTML (app/index.html) 14512
- Knockout Hands-on COPYRIGHT 2014 PLUGRAM, INC.
14512
- Knockout Hands-on COPYRIGHT 2014 PLUGRAM, INC. #
app/scripts/main.js edit app/scripts/main.js JavaScript
(app/script/main.js) 14512
- Knockout Hands-on COPYRIGHT 2014 PLUGRAM, INC. $(function () {
function ViewModel() { var self = this; self.value1 =
ko.observable(0); self.value2 = ko.observable(0); self.result =
ko.computed(function () { return parseInt(self.value1()) +
parseInt(self.value2()); }); } ko.applyBindings(new ViewModel());
}); 14512
- Knockout Hands-on COPYRIGHT 2014 PLUGRAM, INC. grunt serve
14512
- Knockout Hands-on COPYRIGHT 2014 PLUGRAM, INC. ko.observable()
UI ko.observable ko.observableArray() 14512
- Knockout Hands-on COPYRIGHT 2014 PLUGRAM, INC. ko.computed(f)
ko.observable ko.computed ko.computedko.observable 14512
- Knockout Hands-on COPYRIGHT 2014 PLUGRAM, INC. data-bind + =
value binding , , text binding , number, string toString visible ,
style , attr , html , css , custom binding 14512
- Knockout Hands-on COPYRIGHT 2014 PLUGRAM, INC.
ko.applyBindings(vm,node) + = function ViewModel() { var self =
this; self.value1 = ko.observable(0); self.value2 =
ko.observable(0); self.result = ko.computed(function () { return
parseInt(self.value1()) + parseInt(self.value2()); }); }
ko.applyBindings(new ViewModel()); 14512
- Knockout Hands-on COPYRIGHT 2014 PLUGRAM, INC. TODO 14512
- Knockout Hands-on COPYRIGHT 2014 PLUGRAM, INC.
index.html 14512
- Knockout Hands-on COPYRIGHT 2014 PLUGRAM, INC. 14512
- Knockout Hands-on COPYRIGHT 2014 PLUGRAM, INC. $(function () {
function ViewModel() { var self = this; } ko.applyBindings(new
ViewModel()); }); main.js 14512
- Knockout Hands-on COPYRIGHT 2014 PLUGRAM, INC. Add $(function
() { function ViewModel() { var self = this; self.title = "";
self.addTask = function(){ alert(title) }; } ko.applyBindings(new
ViewModel()); }); main.js Add index.html 14512
- Knockout Hands-on COPYRIGHT 2014 PLUGRAM, INC. Add 14512
- Knockout Hands-on COPYRIGHT 2014 PLUGRAM, INC. TaskList
$(function () { function Task(title) { this.title = title; }
function ViewModel() { var self = this; self.tasks =
ko.observableArray([]); // self.title = ""; self.addTask = function
() { var task = new Task(self.title); self.tasks.push(task); }; }
ko.applyBindings(new ViewModel()); }); main.js 14512
- Knockout Hands-on COPYRIGHT 2014 PLUGRAM, INC. 14512
- Knockout Hands-on COPYRIGHT 2014 PLUGRAM, INC. ChromeKnockoutjs
context debugger 14512
- Knockout Hands-on COPYRIGHT 2014 PLUGRAM, INC. TaskList
Task List
index.html 14512
- Knockout Hands-on COPYRIGHT 2014 PLUGRAM, INC. TaskList
14512
- Knockout Hands-on COPYRIGHT 2014 PLUGRAM, INC. TaskList
- delete foreach binding ififnotwith 14512
- Knockout Hands-on COPYRIGHT 2014 PLUGRAM, INC. 14512
- Knockout Hands-on COPYRIGHT 2014 PLUGRAM, INC. 14512
- Knockout Hands-on COPYRIGHT 2014 PLUGRAM, INC. $(function () {
function Task(title) { var self = this; self.title = title; }
function ViewModel() { var self = this; self.tasks =
ko.observableArray([]); self.title = ko.observable("");
self.addTask = function () { var task = new Task(self.title());
self.tasks.push(task); self.title(""); }; self.deleteTask =
function(task) { self.tasks.remove(task); }; } ko.applyBindings(new
ViewModel()); }); 14512
- Knockout Hands-on COPYRIGHT 2014 PLUGRAM, INC.
$parent ViewModel $root ViewModel $data ViewModel $index foreach
14512
- Knockout Hands-on COPYRIGHT 2014 PLUGRAM, INC. sammy.js
14512
- 14512