Невозможно обновить данный элемент в массиве из контроллера Angularjs

Question

Невозможно обновить данный элемент в массиве из контроллера Angularjs

0

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

              <div ng-repeat="criteria in criterias">
                <div class="m-b">
                  <div class="form-group s-b" style="width: 150px;">
                    <span>classification</span>
                    <select  ng-model="criteria.selectedClassification" class="form-control" id="classification" ng-options="classification for classification in classification" ng-change="handleClassification(criteria)" style="max-width:100%"></select>
                  </div>
                  <div class="form-group s-b" style="width: 150px;">
                    <span>Config</span>
                    <select id="config" ng-model="criteria.selectedConfig" ng-options="config for config in config" class="form-control" ng-change="handleConfig(criteria)" style="max-width:100%" ></select>
                  </div>
                  <div class="form-group s-b" style="width: 150px;">
                    <span>Attribute</span>
                    <select id="attribute" class="form-control" ng-options="attribute for attribute in attributes"  ng-model="criteria.selectedAttribute" style="max-width:100%;" ng-change="handleAttrChange(criteria  )"></select>
                  </div>
                  <div class="form-group s-b" style="width: 150px;">
                    <span>Predicate</span>
                    <select class="form-control" ng-model="criteria.predicate"  style="max-width:100%">
                      <option value="matches">Matches</option>
                      <option value="not-matches">Not Matches</option>
                    </select>
                  </div>
                  <div class="form-group s-b" style="width: 100px;">
                    <span>Value</span>
                    <select class="form-control" name="account" ng-model="criteria.value" ng-options="item for item in values" style="max-width:100%">
                    </select>
                  </div>
                  <div class="form-group s-b" style="margin-top: 20px;">
                    <span>
                    <button class="btn btn-sm btn-primary pad-btn" type="submit" ng-click="addCriteria()"><i class="fa fa-plus"></i>
                    </button>
                    <button class="btn btn-sm btn-danger pad-btn" type="submit" ng-click="deleteCriteria(criteria)"><i
                            class="fa fa-minus"></i></button>
                    </span>
                  </div>
                </div>
              </div>

Я завернул код внутри повтора, чтобы пользователь мог создать несколько критериев (каждый из которых имеет одно условие фильтра). Пользователь может создать критерии, щелкнув значок +. Я сталкиваюсь с проблемами при работе с одним критерием, любое обновление, сделанное в config, устанавливает атрибуты всех criteia вместо текущих критериев.

Я создал рабочий плункер для демонстрации этого. Пожалуйста, дайте мне знать, где я ошибаюсь.

Ссылка на Plunker - Ссылка на Plunker

zilcuanu 08 янв. 2016, в 03:37

Источник

Теги:

angularjs

angularjs-scope

angularjs-ng-repeat

angularjs-ng-options

1 ответ

Ещё вопросы

Mike D · Answer 1 · 2016-01-07T23-36-00.000Z

Проблема заключается в вашем списке атрибутов. Всякий раз, когда вы меняете конфигурацию, вы вызываете функцию, которая меняет список атрибутов. Каждая строка критериев рассматривает один и тот же массив атрибутов. Поэтому, если вы измените конфигурацию в первой и третьей строках, они влияют на то, какие атрибуты установлены, поэтому она дважды фильтрует массив.

Чтобы этого избежать, каждая из ваших строк должна иметь массив поисковых запросов, которые вы собираетесь фильтровать. Затем внутри функции ng-изменения отфильтруйте массив, который находится в ваших текущих критериях, так что каждая строка критериев использует его собственный поиск.

Спасибо, что заглянули в это. Не могли бы вы опубликовать изменения или обновить плункер в мою пользу.
Нет, конечно. Поэтому я изменил ng-options = "атрибут для атрибута в атрибутах" на ng-options = "атрибут для атрибута в атрибутах" Затем в контроллере я добавил еще одно свойство в критерии, которое называется атрибутом. Я установил это в $ scope.attributes, а также я установил атрибуты при нажатии нового объекта критерия. Я также взял код, в котором вы устанавливаете поиски, обернул его в функцию и установил начальные критерии после того, как это будет сделано, чтобы атрибуты загружались правильно. plnkr.co/edit/jL6t5ALSyfKjWvAzuSvp?p=preview
Благодарю. Это действительно помогло, так как ng-options меня очень смутил. Еще одна проблема связана со списком массивов конфигурации. Для всех критериев массив config одинаков, даже если мы изменили классификацию. Массив config необходимо обновить в соответствии с выбранной классификацией. Где я делаю неправильно для этого вопроса.
Вы должны сделать то же самое, что и с атрибутами. Имейте поиск как часть каждого объекта и фильтруйте это. Оставьте $ scope.configs всегда таким же, как и ваш источник правдивости всех опций. Также убедитесь, что вы используете angular.copy (), чтобы он не ссылался на тот же объект
Я получаю ваш подход. Было бы здорово, если бы вы могли обновить plunkr, так как мне нужно знать, как вы обрабатываете angular.copy для обновления локальной копии вместо основной копии, чтобы я мог обновить свой другой код моего приложения, где у меня есть аналогичный вариант использования ,
Извините, планкер ушел навсегда :( Всякий раз, когда вы устанавливаете критерии. Конфигурации, это будет crit.configs = angular.copy ($ scope.configs);
Давайте продолжим эту дискуссию в чате .