Магистральная палка selectOptions от ajax

Я пытаюсь заполнить выбор, используя ниже.

 View: Backbone.View.extend({
                    initialize: function () {
                        this.setElement($('#templatePlaceholder'));
                    },
                    bindings: {

                        'select#List': {
                            observe: 'ddList',
                            selectOptions: {
                                collection: Q.when(getSelects.execute()).then(function (data) {
                                    console.dir(data);
                                    return data;
                                })

                            }
                        }
                    },

консоль возвращает объект массива:

 [ { value: 1, label: "a" },   { value: 2, label: "b" } ]

Но я ничего не получаю.

Если я определю коллекцию как:

collection: function () { return [{ value: 1, label: "a" },{ value: 2, label: "b" }];}

тогда все работает нормально.

1 ответ

Решение

С этим потенциально может быть несколько проблем: этот асинхронный код выполняется сразу как View назначается, что может быть нежелательным; и коллекционирование присваивается результату выполнения этого обещания, а не тому, что возвращается return data,

Некоторые решения:

1) Вы можете загрузить выбранные параметры при загрузке страницы. Это популярный шаблон в одностраничных приложениях или приложениях Backbone. По сути, у вас есть серверная часть, которая собирает структуры данных json с общими данными, а затем выводит их на страницу в виде переменной javascript. Поэтому шаблон на стороне сервера (jsp, erb, php) будет выглядеть примерно так:

<!DOCTYPE html>
...
    <script type="text/javascript">
       window.bootstrap = { users: <%= userjson %>, ddlist: <%= ddlistjson %> };
    </script>
...

Этот метод рекомендуется для производительности и удобства.

2) Если у вас есть возможность запустить getSelects.execute() синхронно - например, если это ajax-запрос jQuery, запустите его с async:false вариант - тогда вы можете выполнить его в нескольких местах в представлении. В течение initialize будет получать данные, когда представление фактически построено. Или вы можете назначить свой collection связывание с функцией, которая запускает процедуру getSelects, которая блокирует, а затем возвращает данные:

collection: function() {
    var collection = [];
    // Assumes that getSelects.execute() will block and run synchronously.
    Q.when(getSelects.execute()).then(function (data) {
       collection = data;
    });
    return collection;
}

Этот метод не рекомендуется, поскольку он может оставить ваш пользовательский интерфейс в шутливом состоянии, так как он блокирует запуск другого javascript и потенциально может зависнуть.

Другие вопросы по тегам