AngularJS - Ng-повтор с переключателями и логическим значением

0

У меня есть массив Book -objects, каждый из которых имеет boolean свойство Favorite. Только одна из книг имеет параметр "Избранное", равный true.

Я показываю эти книги с помощью ng-repeat, и я хочу, чтобы вы могли установить любимую книгу с помощью переключателей. Однако, несмотря на то, что при загрузке страницы выбран правильный переключатель, модель не обновляет логические значения при выборе другого переключателя.

Вот мой код:

<ul>
    <li ng-repeat="book in vm.Books">
        {{book.Name}}
        <input name="book" type="radio" ng-model="book.Favorite" ng-value="book.Favorite" /> 
    </li>
<ul>

Как обновить модель с помощью Favorite -value на основе зарегистрированного переключателя?

  • 0
    почему у вас есть значение и модель, указывающая на одну и ту же переменную? Таким образом, вы всегда устанавливаете значение в объекте книги в значение, которое имеет этот объект, поэтому, вероятно, поэтому ...
  • 0
    удалить name="book" поскольку это не должно быть необходимо. ng-value="{{expression}}" не должно быть динамическим значением из модели, а должно иметь фиксированное уникальное значение, например book.uniqueId
Показать ещё 4 комментария
Теги:
radio-button
angularjs-ng-repeat

1 ответ

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

Следующее близко, но не будет задано book.Favorite to false когда вы выбираете другой (который, как я предполагаю, вы хотите?):

<li ng-repeat="book in vm.Books">
  {{book.Name}}
  <input name="book" type="radio" ng-model="book.Favorite" ng-value="true">
</li>

Я бы просто пошел следующим образом:

<li ng-repeat="book in vm.Books">
  {{book.Name}}
  <input type="radio" ng-click="vm.setFavorite(book)" ng-checked="book.Favorite">
</li>

А также:

vm.setFavorite = function(book) {

  vm.Books.forEach(function(b) {
    b.Favorite = book === b;
  });
};

Демо: http://plnkr.co/edit/UKGQW1dd8M5UiEbUCxWd?p=preview

  • 0
    Именно то, что я искал, спасибо!
  • 0
    Пожалуйста :)

Ещё вопросы

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