2015-11-21 4 views
0

Я новичок в нокауте, и я понятия не имею, почему я получаю это сообщение.Нокаут - невозможно обработать привязку, gridViewModel не определен

Невозможно обработать привязку «simpleGrid: function() {return gridViewModel}» Сообщение: gridViewModel не определен;

library_customization.js

define(['services/logger'], function (logger) { 
var title = 'Library Customization'; 
var vm = { 
    activate: activate, 
    title: title 
}; 

return vm; 


var initialData = [ 
{ name: "Well-Travelled Kitten", sales: 352, price: 75.95 }, 
{ name: "Speedy Coyote", sales: 89, price: 190.00 }, 
{ name: "Furious Lizard", sales: 152, price: 25.00 }, 
{ name: "Indifferent Monkey", sales: 1, price: 99.95 }, 
{ name: "Brooding Dragon", sales: 0, price: 6350 }, 
{ name: "Ingenious Tadpole", sales: 39450, price: 0.35 }, 
{ name: "Optimistic Snail", sales: 420, price: 1.50 } 
]; 

var PagedGridModel = function (items) { 
    this.items = ko.observableArray(items); 

    this.addItem = function() { 
     this.items.push({ name: "New item", sales: 0, price: 100 }); 
    }; 

    this.sortByName = function() { 
     this.items.sort(function (a, b) { 
      return a.name < b.name ? -1 : 1; 
     }); 
    }; 

    this.jumpToFirstPage = function() { 
     this.gridViewModel.currentPageIndex(0); 
    }; 

    this.gridViewModel = new ko.simpleGrid.viewModel({ 
     data: this.items, 
     columns: [ 
      { headerText: "Item Name", rowText: "name" }, 
      { headerText: "Sales Count", rowText: "sales" }, 
      { headerText: "Price", rowText: function (item) { return "$" + item.price.toFixed(2) } } 
     ], 
     pageSize: 4 
    }); 
}; 

ko.applyBindings(new PagedGridModel(initialData)); 

function activate() { 
    logger.log(title + ' selected', null, title, true); 
    return true; 
} 

}); 

library_customization.html

<!DOCTYPE html> 
    <html id="libraryCust"> 
    <head> 

    <title> Project</title> 

    <script type="text/javascript" src="../../Scripts/knockout-3.3.0.js 
    </script> 

    </head> 
    <body> 
    <section> 
     <h2 class="page-title" data-bind="text: title"></h2> 
    </section> 


    <div class='liveExample'> 

     <div data-bind='simpleGrid: gridViewModel'></div> 
     <!-- --> 
     <button data-bind='click: addItem'> 
      Add item 
     </button> 

     <button data-bind='click: sortByName'> 
      Sort by name 
     </button> 

     <button data-bind='click: jumpToFirstPage, enable: gridViewModel.currentPageIndex'> 
      Jump to first page 
     </button> 

    </div> 

    </body> 
    </html> 

ответ

0

Проверьте скрипку: JS Fiddle

Я думаю, что главная проблема заключается в том, что вы выйдете из модуля раньше запланировано в коде ниже:

var title = 'Library Customization'; 
var vm = { 
    activate: activate, 
    title: title 
}; 

return vm; 

/* your main code follows below but never executes */ 

Поэтому я переместил эти свойства в конструктор PagedGridModel.

+0

Спасибо за ответ. Когда я пишу такие вещи в своем проекте, я до сих пор получаю это сообщение об ошибке: ** Неиспользуемая ошибка: не удалось загрузить маршрутизируемый модуль (viewmodels/library_customization). Подробности: вы не можете применять привязки несколько раз к одному и тому же элементу. ** Не могли бы вы рассказать мне, почему, или, по крайней мере, где я должен искать ошибки? – kata

+0

@kata У вас, по-видимому, несколько вызовов на 'ko.applyBindings'. Обычно это плохая идея, но если вы собираетесь это сделать, вам нужно ограничить каждый вызов элементом DOM, передав второй аргумент. –

+0

Если вам нужны несколько моделей ko, работающих одновременно, вам нужно указать элементы для привязки к следующим: 'ko.applyBindings (yourViewModel, document.getElementById (elementId))'. Или, если у вас есть одна модель просмотра, как сказал Рой, вы, вероятно, несколько раз называете «ko.applyBindings» на одном и том же элементе или целом документе. Проверьте места, где вы называете 'ko.applyBindings', чтобы убедиться, что они не перекрываются. –

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