2013-03-05 3 views
0

У меня есть список брендов и бренды содержит список автомобилей. Объявленная простая модель просмотра в нокаут на http://jsfiddle.net/PZqEk/1/. this.cars undefined в функции removeCar при нажатии кнопки удаления. Как удалить автомобиль с помощью лучшей практики?как назвать функцию нокаута в вложенном наблюдаемом массиве

Html:

<h1 data-bind="text:title"></h1> 
<table> 
    <tbody data-bind="foreach: brands"> 
     <tr> 
      <td> 
       <span data-bind="text: nameOfBrand"></span> 
       <ul data-bind="foreach: cars"> 
        <li> 
         <span data-bind="text: nameOfCar"></span> 
         (<span data-bind="text: yearOfCar"></span>) 
         <input data-bind="click: $root.removeCar" type="button" value="remove"/> 
        </li> 
       </ul> 
      </td> 
     </tr> 
    </tbody> 
</table> 

Javascript:

function RootModel() 
{ 
    this.title = ko.observable("Dummy Title"); 
    this.brands = ko.observableArray(); 

    var b1 = new brandModel("Audi"); 
    b1.cars.push(new carModel("A3", 2005)); 
    b1.cars.push(new carModel("A6", 2005)); 

    var b2 = new brandModel("Volkswagen"); 
    b2.cars.push(new carModel("Golf", 2010)); 
    b2.cars.push(new carModel("Passat", 2008)); 
    b2.cars.push(new carModel("Polo", 2012)); 

    this.brands.push(b1); 
    this.brands.push(b2); 
} 

function brandModel(name) 
{ 
    this.nameOfBrand = ko.observable(name); 
    this.cars = ko.observableArray(); 

    this.removeCar = function(car){ 
     this.cars.remove(car); // this.cars = undefined; 
    } 
} 

function carModel(name, year){ 
    this.nameOfCar = ko.observable(name); 
    this.yearOfCar = ko.observable(year); 
} 

ko.applyBindings(new RootModel()); 

Благодаря

ответ

1

Проблема заключается в том, что вы обращаетесь this из функции, которая не вызывается на экземпляре. Вам понадобится псевдоним.

function brandModel(name) { 
    var self = this; // alias 
    self.nameOfBrand = ko.observable(name); 
    self.cars = ko.observableArray(); 

    self.removeCar = function(car) { 
     self.cars.remove(car); // access through the alias instead 
    } 
} 
+1

Да, конечно, это все. объявленный var self = this; и его работа :) –

0

Джефф прав в том, что вы должны псевдоним this (обычно объявляя self = this; в верхней части модели), и я бы рекомендовал делать это для каждого приложения Knockout вы делаете.

Однако, я не заметил, что вы использовали this в первом, и сразу же попробовал этот код:

<input data-bind="click: function(data, event) { $parent.removeCar(data); }" type="button" value="remove"/> 

и как только изменения в вашей скрипке, которая работала.

+0

Да, конечно, это все. объявленный var self = this; и его работа :) –

Смежные вопросы