В моем приложении Angular у меня есть простая фабрика уведомлений, которая позволяет мне хранить и получать информацию, которую я хочу передать пользователю:
(function() {
'use strict';
angular
.module('peaches')
.factory('NotificationFactory', factory);
// factory.$inject = ['dependencies'];
/* @ngInject */
function factory() {
var messages = [];
var service = {
postAlert: postAlert,
getAlerts: getAlerts,
deleteAlert: deleteAlert
};
return service;
function postAlert(alert) {
messages.push(alert);
if (alert.duration) {
setTimeout(function() {
deleteAlert(alert);
}, alert.duration)
}
}
function getAlerts() {
return messages;
}
function deleteAlert(alert) {
messages.splice(messages.indexOf(alert), 1);
}
}
})();
Как вы можете видеть в функции postAlert
, я хочу иметь возможность удалить уведомление, если указанное уведомление имеет свойство duration
, через duration
количество миллисекунд.
Цель состоит в том, чтобы определенные виды уведомлений автоматически исчезали через несколько секунд, а не требовали взаимодействия для закрытия.
Это образец уведомления:
var reportSaved = {
msg: "Report saved.",
type: "success",
duration: 1500
}
Однако происходит то, что, хотя setTimeout
работает по назначению и эффективно удаляет уведомление после набора duration
, элемент все еще рисуется до тех пор, пока я не сменю страницу (после чего он исчезает, как предполагалось), поэтому ng-repeat
никогда не обновляется после вызова deleteAlert
с моей фабрики.
Это HTML:
<div class="notification" ng-repeat="alert in vm.alerts(); track by $index" ng-cloak>
<i ng-if="alert.type === 'notification'" class="fa fa-spinner"></i><i ng-if="alert.type === 'success'" class="fa fa-check-circle"></i> {{alert.msg}}
</div>
Как лучше всего подойти к этой проблеме?
$timeout/$interval
вместо нативных. Оболочка Angulars запускает цикл дайджеста при запуске. В противном случае вы потенциально можете оказаться в ситуации, когда ваша модель изменена, но ваше представление не обновляется. Это потенциально может быть проблемой. - person ste2425   schedule 19.11.2015