привязка к данным в области jquery ready (), но вне модели выбивки

0

Я пытаюсь связать элементы select в своем представлении с использованием массивов с произвольными данными, которые определены вне моей модели, но внутри функции jquery ready():

<select data-bind='options: itemsList,                                      
                   value: selectedItem'>
</select>


 $(document).ready(function($) {
    var itemsList = ["one", "two", "three"];

    function ViewModel() {
      var self = this;      
      self.selectedItem = ko.observable();   
    };
    ko.applyBindings(new ViewModel());
});

Это не работает, поскольку itemsList находится вне модели, но внутри ready(), что делает его недоступным для элемента select вида.

Я мог бы сделать itemsList часть модели с помощью наблюдаемого массива...

 function ViewModel() {
    var self = this;    
    self.itemsList = ko.observableArray(itemsList);  
    self.selectedItem = ko.observable();   
 };

..Это работает, но заставляет меня переопределить toJSON() для каждой сущности, чтобы подавить сериализацию всех наблюдаемых массивов, а не часть желаемого выхода json.

Другой вариант - добавить все массивы в глобальную область:

  <script>
     var itemsList = ["one", "two", "three"];
     var anotherList = ...
  </script>

Это рискованно, и, честно говоря, это дает мне ульи; Я не предпочитаю этого; Я предполагаю, что есть лучшая альтернатива?

Я рассмотрел документацию по привязке к нокауту и, основываясь на моем понимании, ни $root файл $root ни $parent могут получить доступ к области за пределами корневой модели.

Теги:
knockout.js

2 ответа

1
Лучший ответ

Поместите все, что вы хотите сериализовать, в toJSON() и вызовите toJSON() на ней вместо корневой модели. Затем вы можете поместить itemsList в корневую модель и получить доступ к ней из привязок.

  • 0
    Неплохая идея; это только одно поле для добавления, я могу использовать $root.lists.listName из любого места в представлении, только что подтвердил, прекрасно работает.
0

Я не знаю о ко, но я думаю, что это должно работать:

<select data-bind='options: KoRepos.itemsList,                                      
                   value: selectedItem'>
</select>


 var KoRepos = {};  //Container for 'global' data repositories

 $(document).ready(function($) {
    KoRepos.itemsList = ["one", "two", "three"];

    function ViewModel() {
      var self = this;      
      self.selectedItem = ko.observable();   
    };
    ko.applyBindings(new ViewModel());
});

Таким образом, вы не загрязняете глобальное пространство имен, добавляется только один новый var (KoRepos).

надеюсь, это поможет

  • 0
    Да, это то же самое, что и ebohlman, используя контейнерный подход, спасибо.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню