Я программирую приложение чата, в котором я хочу иметь удобочитаемые относительные временные метки в сообщениях. Я использую фильтр, который принимает временную метку JS и (с библиотекой Moment.js) выводит строку, представляющую относительное время (например, «несколько секунд назад»). Вот соответствующие отрывки кода:

HTML:

  • JS:

    angular.module("ChatApp").
    filter("moment",function(){
        return function(jstimestamp){
            //using the Moment.js library to create a relative-time string
            return moment(parseInt(jstimestamp)).fromNow();
        }
    });
    

    Как заставить AngularJS пересчитывать ng-attr-title периодически, даже если $ scope.timestamp никогда не изменяется, так что "несколько секунд назад" будет обновлено до " минуту назад »и так далее? В настоящее время он обновляется только при перезагрузке страницы.

    Ответы (2)

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

    angular.module («ChatApp»).
    filter ("момент", function () {
    
      function innerFilter (jstimestamp) {
        // использование библиотеки Moment.js для создания строки относительного времени
        момент возврата (parseInt (jstimestamp)). fromNow ();
      }
      innerFilter. $ stateful = true;
    
      return innerFilter;
    });
    

    Вы можете добавить интервал в свой контроллер, чтобы он работал без ввода данных пользователем.

    var intervalPromise = $interval(function() {}, 1000);
    
    $scope.$on('$destroy', function() {
       $interval.cancel(intervalPromise);
    });
    

    Нет необходимости вызывать apply внутри интервала, поскольку каждый тик $ interval уже запускает цикл дайджеста.

    Здесь вы можете увидеть рабочий пример .

    Дополнительную информацию о фильтрах с отслеживанием состояния можно найти на странице документации здесь.

    Это кажется плохой идеей, но это может сработать, если вручную запустить цикл $ apply. Остерегайтесь влияния на производительность, так как оно будет работать со всеми вашими привязками. Это будет обновлять ваши привязки каждую секунду, вы можете настроить его по своему желанию:

    angular.module('app', [])
    .run(['$interval', '$rootScope', function ($interval, $rootScope) {
          $interval(function () {
            $rootScope.$apply();
          }, 1000, 0, false);
        }]);
    

    2022 WebDevInsider