knockout小记

一、基础部分lastName

单次绑定

从ViewModel绑定至UI这一层只进行一次绑定，不追踪数据在任何一方的

function AppViewModel() {    this.firstName = "Bert";    this.lastName = "Bertington";}
ko.applyBindings(new AppViewModel());
First name:

Last name:

双向绑定

输入框中值发生改变时，标签中显示内容相应发生改变

function AppViewModel() {
  this.firstName = ko.observable("Bert");
  this.lastName = ko.observable("Bertington");
}
ko.applyBindings(new AppViewModel());
First name:
Last name:
First name:
Last name: 

依赖绑定

fullName依赖于firstName和lastName，改变firstName和lastName任意值，fullName的显示也相应改变

function AppViewModel() {
  this.firstName = ko.observable("Bert");
  this.lastName = ko.observable("Bertington");
  this.fullName = ko.computed(function() {  
    return this.firstName() + " " + this.lastName();
  }, this);
}
ko.applyBindings(new AppViewModel());
First name:
Last name:
First name:
Last name:
Full name: 
   

绑定数组

seats对象绑定了一个集合对象，在html view中，通过foreach指令渲染视图

Your seat reservations

  
    
      
      
      
    
  
  
   
     
     
     
     
  
Passenger name
MealSurcharge
Surcharge




function SeatReservation(name, initialMeal) {
   var self = this;
   self.name = name;
   self.meal = ko.observable(initialMeal);
}  

function ReservationsViewModel() {
   var self = this;
   self.availableMeals = [ 
     { mealName: "Standard (sandwich)", price: 0 },
     { mealName: "Premium (lobster)", price: 34.95 },
     { mealName: "Ultimate (whole zebra)", price: 290 }
   ];
   self.seats = ko.observableArray([
     new SeatReservation("Steve", self.availableMeals[1]),
     new SeatReservation("Bert", self.availableMeals[2])
   ]);
 }
ko.applyBindings(new ReservationsViewModel());

哪位大神这玩意怎么编写代码 我能说这是一个一个敲出来的吗？  实在是累啊  求好心人告知