У мене є кілька прапорців:
Це я хотів би прив'язати до списку в моєму контролері таким чином, що кожного разу, коли змінюється прапорець, контролер зберігає список всіх перевірених значень, наприклад [ 'apple', 'pear'].
Ng-model, схоже, може прив'язувати значення одного єдиного прапорця до змінної в контролері.
Чи є інший спосіб зробити це, щоб я міг прив'язати чотири прапорця до списку в контролері?
Є два способи підійти до цієї проблеми. Або використовуйте простий масив або масив об'єктів. У кожного рішення є плюси і мінуси. Нижче ви знайдете по одному для кожного випадку.
За допомогою простого масиву в якості вхідних даних
HTML може виглядати так:
І відповідний код контролера буде:
Плюси. проста структура даних і перемикання на ім'я легко обробляються
Мінуси. додавання / видалення є громіздким, оскільки потрібно управляти двома списками (введення і вибір)
З масивом об'єктів в якості вхідних даних
HTML може виглядати так:
І відповідний код контролера буде:
Плюси. Додати / видалити дуже просто
Мінуси. дещо складніша структура даних і перемикання на ім'я є громіздкими або вимагають допоміжного методу
Ось коротка невелика багаторазова директива, яка, схоже, робить те, що ви хочете зробити. Я просто назвав його checkList. Він оновлює масив при зміні прапорців і оновлює прапорці при зміні масиву.
Ось контролер і уявлення, яке показує, як ви можете використовувати його.
(Кнопки показують, що зміна масиву також оновить прапорці.)
Грунтуючись на відповідях в цьому потоці, я створив директиву checklist-model, яка охоплює всі випадки:
- Простий масив примітивів
- Масив об'єктів (вибрати ідентифікатор або весь об'єкт)
- Ієрархія властивостей об'єкта
Для випадку з стартом-стартом це буде:
Директива checklist-model на GitHub Віталія Потапова абсолютно спрацювала для мене (з використанням складних об'єктів).
Я витратив кілька годин, намагаючись змусити інші рішення працювати без везіння. Відмінна робота, життєрадісні!
Використання рядка $ index може допомогти використовувати хеш-карту обраних значень:
Таким чином, об'єкт ng-model оновлюється ключем, що представляє індекс.
Через деякий час $ scope.someObject повинен виглядати приблизно так:
Цей метод не буде працювати для всіх ситуацій, але його легко реалізувати.
Оскільки ви взяли відповідь, в якому список було змарновано, я буду вважати відповідь на моє запитання з питанням: «Ні, це не обов'язково повинен бути список». У мене також склалося враження, що, може бути, ви розгубили сервер HTML, так як «check» присутній в вашому прикладі HTML (це не знадобилося б, якщо ng-model використовувалася для моделювання ваших прапорців).
У всякому разі, ось що я мав на увазі, коли ставив питання, також припускаючи, що ви створюєте сервер HTML-сервер:
Ng-init дозволяє сформованому на стороні сервера HTML спочатку встановлювати певні прапорці.
Я адаптував прийнятий відповідь Йоші для вирішення складних об'єктів (замість рядків).
У HTML (припустимо, що прапорці знаходяться в першому стовпці кожного рядка таблиці).
У файлі controllers.js.
Ось ще одне рішення. Потенціал мого рішення:
- Він не вимагає ніяких додаткових годин (що може вплинути на продуктивність)
- Він не вимагає ніякого коду в контролері, щоб він був чистим
- Код і раніше кілька короткий
- Це вимагає дуже мало коду для повторного використання в декількох місцях, тому що це всього лише директива
В кінці просто використовуйте його так:
І це все, що є. Єдиним доповненням є атрибут checkbox-array-set.
Ви можете комбінувати AngularJS і jQuery. Наприклад, вам потрібно визначити масив, $ scope.selected = [] ;. У контролері.
Ви можете отримати масив, який володіє обраними елементами. Використовуючи метод alert (JSON.stringify ($ scope.selected)). ви можете перевірити вибрані елементи.
Існує спосіб працювати з масивом безпосередньо і використовувати ng-модель в той же час через ng-model-options = "
Хитрість полягає у використанні функції getter / setter у вашій ng-моделі. Таким чином, ви можете використовувати масив як свою реальну модель і «підробку» логічних елементів в моделі введення:
CAVEAT. Ви не повинні використовувати цей метод, якщо ваші масиви великі, оскільки myGetterSetter буде називатися багато разів.
Наступне рішення здається хорошим варіантом,
І в моделі контролера значення fruits буде таким