Обновление Div с AngularJS

Question

Обновление Div с AngularJS

0

У меня есть DIV, определяемый следующим образом:

    <button ng-repeat="message in user.messages">

    <div ng-model="message" ng-show="{{message.received && !message.read}}" class="btn bg-green"></div>
    <div ng-model="message" ng-show="{{message.received && message.read}}" class="btn bg-green" ></div>
    <div ng-model="message" ng-show="{{!message.received}}" class="btn bg-amber"></div>

В основном я меняю (показываю/скрываю) значок в зависимости от состояния сообщения (полученного, отправленного, прочитанного). Однако, когда я обновляю статус сообщения, значки не меняются, хотя я связал его с ng-model. Мне нужно обновить всю страницу, чтобы обновить значки.

Как я могу сделать это обновление через Angular?

Спасибо.

madu 25 апр. 2016, в 03:41

Источник

0

У вас есть код angularjs, который вы можете показать?
sebenalern 25 апр. 2016, в 01:48

Теги:

html

angularjs

css

data-binding

angular-ngmodel

2 ответа

1

Кажется, что вы привязываете все три элемента div к ng-модели, когда им не нужно. ng-модель должна быть привязана только к вводу, select, textarea или другому пользовательскому вводу. См. Https://docs.angularjs.org/api/ng/directive/ngModel

Использование ng-класса должно решить эту проблему без необходимости в 3 отдельных div. Это позволит вам динамически изменять класс на основе разных выражений. https://docs.angularjs.org/api/ng/directive/ngClass

<div ng-class="{'bg-green': message.received && !message.read, 'bg-amber': !message.received}"></div>

phoffman 25 апр. 2016, в 00:30

0

Спасибо, Фоффман. ngClass это исправил.
madu 25 апр. 2016, в 02:36

Ещё вопросы

У вас есть код angularjs, который вы можете показать?
Спасибо, Фоффман. ngClass это исправил.

Kobi Cohen · Accepted Answer · 2016-04-25T00-04-00.000Z

ng-show не нужно интерполировать, вы можете просто написать "message.recieved..."
почему бы не использовать ng-класс следующим образом:

div ng-class= "{'bg-green': message.recieved, 'bg-amber':! meessage.recieved}"

Не связывайте div с ng-моделью, не имеет смысла использовать двустороннюю привязку данных, когда она не является входом, и представление не может обновить модель