массив не привязан для выбора с помощью AngularJs

Question

массив не привязан для выбора с помощью AngularJs

0

Я собираю коллекцию под названием CommandGroup, как это

        function getCommandGroups() {
        $scope.commandGroups = commandGroupResource.query();

        return $scope.commandGroups.$promise.then(function (response) {

            $scope.commandGroups = response;

        });

    }

мой html выглядит так.

                        <select ng-model="vm.Job.CommandGroup" name="ddlCommandGroup" bootstrap-dropdown>
                        <option value="">Select Something</option>
                        <option ng-repeat="cmdGroup in commandGroups" value="{{cmdGroup.Id}}">{{cmdGroup.Name}}</option>
                    </select>

по какой-то причине падение остается пустым. Функция getCommandGroups() вызывает обратную связь и заполняет commandGroups массивом объектов, каждый из которых имеет идентификатор и имя.

Пожалуйста помоги.

ОБНОВИТЬ

я понял, что что-то не так с директивным бутстрапом-выпадающим списком, который требуется, поскольку это Bootstrap-select

angular
.module('app').directive('bootstrapDropdown', ['$timeout',
    function ($timeout) {
        return {
            restrict: 'A',
            require: '?ngModel',
            link: function (scope, element, attrs, ngModel) {                  
                $timeout(function () {
                    element.selectpicker();
                });
            }
        };
    }
]);

Raas Masood 21 авг. 2015, в 21:50

Источник

0

Не могли бы вы подтвердить, что response имеет это значение?
Pankaj Parkar 21 авг. 2015, в 19:16
0

да ответ в порядке
Raas Masood 21 авг. 2015, в 19:16
0

я добавил изображение ответа.
Raas Masood 21 авг. 2015, в 19:18
0

не могли бы вы попытаться разместить {{commandGroups}} похоже, что вы столкнулись с проблемой, связанной с областью видимости ... вы поместили этот div внутри ng-if или ng-repeat
Pankaj Parkar 21 авг. 2015, в 19:35
0

Мне непонятно, почему (и что) вы возвращаете из getCommandGroups() - нужна только первая строка. Вы можете удалить всю инструкцию возврата.
marapet 21 авг. 2015, в 19:35
0

commandGroupResource использует $ resource внутренне для возврата, поэтому я использую обещание.
Raas Masood 21 авг. 2015, в 19:37
0

Вы можете предоставить кодовую ручку для своего кода?
neetesh 21 авг. 2015, в 19:38
0

все работает, если у меня есть жестко закодированный массив commandGroups. но так как это возвращается обещанием, это не работает должным образом. Я постараюсь создать codepen.
Raas Masood 21 авг. 2015, в 19:39
0

@Pnkaj, что вы подразумеваете под "place {{commandGroups}}"
Raas Masood 21 авг. 2015, в 19:40

Показать ещё 7 комментариев

Теги:

javascript

angularjs

select

angular-promise

3 ответа

1

Этот список содержит точный код, который вы предоставили, за исключением директивы bootstrap-dropdown и вашего фактического веб-сервиса. Код функционирует так, как ожидалось. Это указывает на наличие проблемы в другом месте кода, который вы не предоставили.

Возможные проблемы:

~~Директива bootstrap-dropdown делает что-то смешное.~~

а. UPDATE: директива работает "отлично" в этом плунге. Не уверен, что он должен делать, но это не вызывает поведение, которое вы описываете.
В вашей разметке отсутствует ng-controller.
Что-то еще, что мы не можем видеть, это очистить $ scope.commandGroups.

Taylor Buchanan 21 авг. 2015, в 18:21

0

я обновил свой вопрос что-то не так с директивой.
Raas Masood 21 авг. 2015, в 20:17

0

Переназначение $ scope.commandGroups может мешать циклу дайджеста обещания/объема. Попробуйте изменить функцию следующим образом:

function getCommandGroups() {
    commandGroupResource.query().$promise.then(function (response) {
        $scope.commandGroups = response;
    });
}

user3233089 21 авг. 2015, в 18:46

Ещё вопросы

Не могли бы вы подтвердить, что response имеет это значение?
не могли бы вы попытаться разместить {{commandGroups}} похоже, что вы столкнулись с проблемой, связанной с областью видимости ... вы поместили этот div внутри ng-if или ng-repeat
Мне непонятно, почему (и что) вы возвращаете из getCommandGroups() - нужна только первая строка. Вы можете удалить всю инструкцию возврата.
commandGroupResource использует $ resource внутренне для возврата, поэтому я использую обещание.
Вы можете предоставить кодовую ручку для своего кода?
все работает, если у меня есть жестко закодированный массив commandGroups. но так как это возвращается обещанием, это не работает должным образом. Я постараюсь создать codepen.
@Pnkaj, что вы подразумеваете под "place {{commandGroups}}"
я обновил свой вопрос что-то не так с директивой.

igorshmigor · Accepted Answer · 2015-08-21T20-27-00.000Z

2

Лучший ответ

Я считаю, что проблема заключается в том, что сторонний JavaScript (bootstrap-select) не получает информацию об изменении. Вероятно, вам придется вызвать selectpicker ('refresh') в элементе после назначения ответа командамGroups.

Обновление: также необходимо использовать $ scope. $ Apply() перед вызовом selectpicker ('refresh'):

function getCommandGroups() {
    $scope.commandGroups = commandGroupResource.query();

    return $scope.commandGroups.$promise.then(function (response) {
        $scope.commandGroups = response;
        $scope.$apply();
        $('.mySelect').selectpicker('refresh'); 
    });
}

См. Комментарий ниже для вилки Taylor Buchanan Plunk, чтобы увидеть это в действии.

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

function getCommandGroups() {
   $scope.commandGroups = commandGroupResource.query();

   return $scope.commandGroups.$promise.then(function (response) {
        $scope.commandGroups = response;
        $timeout(
           function(){
               $('.mySelect').selectpicker('refresh'); 
           }
        );
   });
}

igorshmigor 21 авг. 2015, в 20:27

0

я добавил class = "mySelect" в html и $ scope.commandGroups = response; $ ( 'MySelect ') selectpicker (' Обновить'). все еще не повезло.
Raas Masood 22 авг. 2015, в 03:49
0

Что произойдет, если вы закомментируете строку element.selectpicker в директиве bootstrapDropdown, просто для устранения неполадок? Вы должны увидеть обычное поле выбора, обновляется ли оно после того, как вы присвоили новое значение commandGroups? Если нет, поможет ли после этого добавить $ scope. $ Apply ()?
igorshmigor 22 авг. 2015, в 06:30
0

Я только что поиграл с Plunk Тейлора Бьюкенена и разветвил его, чтобы включить bootstrap-JavaScripts и CSS: plnkr.co/edit/MFhElUgAnCNY9XY0SdRV?p=preview Добавление $ scope. $ Apply () перед обновлением раскрывающегося списка начальной загрузки с помощью selectpicker (' refresh ') работает в этом Plunk. Я думаю, что это могло быть проблемой.
igorshmigor 22 авг. 2015, в 09:21
0

То, что в plunkr, я следовал за этим, это работает, означает идею применить прежде, чем selectpicker работает, но я также получаю дайджест, я прогрессирую ошибку.
Raas Masood 23 авг. 2015, в 19:44
0

Понимаю. Я полагаю, это ошибка "Дайджест уже выполняется"? В этом случае вместо применения области применения используйте тайм-аут.
igorshmigor 24 авг. 2015, в 05:16
0

Лил подсказка, где использовать тайм-аут? В директиве?
Raas Masood 24 авг. 2015, в 05:17
0

Извините, я хотел предоставить код в комментарии, но, нажав клавишу возврата, разместил комментарий, а не разрыв строки. Вместо этого я добавил код к ответу. Использование $ timeout без задержки приведет к выполнению кода внутри, когда цикл дайджеста закончится, и, таким образом, перед обновлением селектора начальной загрузки убедитесь, что все обновлено.
igorshmigor 24 авг. 2015, в 05:35
0

awsomee его работа хотела бы отметить это как ответ. но, пожалуйста, один совет, можно ли это сделать как-то в директиве, потому что такого рода инициирование управления выполняется в директиве? Я думаю, нет, потому что это обновление должно произойти после ответа, который я назначил для commandGroups. имеет смысл, но я думаю, я должен принять это как проблему с контролем. что ты сказал
Raas Masood 24 авг. 2015, в 05:38
0

Это можно сделать в директиве, если вы добавляете наблюдателя с помощью $ watch. Вы должны написать свою директиву таким образом, чтобы вы могли передать ей название модели для просмотра.
igorshmigor 24 авг. 2015, в 05:43
0

что-то вроде scope. $ watch (attrs.ngModel, function (newValue, oldValue) {});
Raas Masood 24 авг. 2015, в 05:44
0

В настоящее время у меня нет времени углубляться в это, но я думаю, что вы на правильном пути. Не смотрите на модель элемента select, потому что это модель для выбранного значения, а не для массива возможных значений.
igorshmigor 24 авг. 2015, в 06:30
0

я задаю вопрос здесь. stackoverflow.com/questions/32187385/… я думаю, я почти там, как вы предложили. Буду признателен, если вы могли бы посмотреть.
Raas Masood 24 авг. 2015, в 16:40

Показать ещё 10 комментариев