Angular DOM: Dom не обновляется каждые 1000 мс с интервалом в $ - PullRequest
Новая
       8

Angular DOM: Dom не обновляется каждые 1000 мс с интервалом в $

0 голосов
/ 06 июня 2018

ссылка на изображение для ошибки Я пытаюсь обновлять angular dom каждую секунду данными времени, которые не обновляются, даже если на консоли запущен $ digest, но значение его не обновляется. 

  angular.module('app').controller('mvCoursesDetailCtrl', function($scope, mvCourse, $routeParams,$interval) {

     $scope.test;

     $scope.course = mvCourse.get({_id:$routeParams.id}, (data)=> {
      console.log(data.published);
      console.log(data.endDate);
      let oneDay = 1000*60*60*24;
      let oneHour = 1000*60*60;
      let oneMinute = 1000*60;
      let oneSecond = 1000;
      let startDate = new Date();
      let startMonth = startDate.getMonth() + 1;
      let endDate = new Date(data.endDate);
       $interval(function () {
       $scope.test = Math.ceil(Math.abs(((startDate.getTime()) - (endDate.getTime())))/oneMinute)+" Minutes "+Math.ceil(Math.abs(((startDate.getTime()) - (endDate.getTime())))/oneSecond)+" s";
        console.log($scope.test);
      },1000);


     });
    });

Здесь переменная test не обновляется 

<div class="container">
  <h1>{{course .title}}
    <div class="row">
      <div class="col-md-12">
        <h3>Featured</h3>
      </div>
    </div>
    <div class="row">
      <div class="col-md-6">
        <div class="row">
          <div class="col-md-6">
            <h3>Published on</h3>
            <h4>{{course.published | date}}</h4>
          </div>
          <div class="col-md-6">
            <h3>Status</h3>
            <h4 ng-show="course.status.toLowerCase() === 'open'">
              <mark class="open">{{course.status | uppercase}}</mark>
            </h4>
            <h4 ng-show="course.status.toLowerCase() === 'booked'">
              <mark class="booked">{{course.status | uppercase}}</mark>
            </h4>
          </div>
        </div>
        <div class="row">
          <div class="col-md-6">
            <h3>Time Left</h3>
            <h4>{{test}}</h4>
          </div>
        </div>
      </div>
      <div class="col-md-6">
        <div class="panel panel-primary">
          <div class="panel-heading">Tags</div>
          <div class="panel-body">
            <div ng-repeat="tag in course.tags">{{tag}}</div>
          </div>
        </div>
      </div>
    </div>
  </h1>
</div>

Пожалуйста, направьте меня.

Ответы [ 3 ]

0 голосов
/ 06 июня 2018

Первый - инициализировать $ scope.test с некоторым значением, $ scope.test = "";Второе - вы должны использовать $ scope. $ Apply () внутри метода $ interval.$ scope. $ apply () вызовет $ scope. $ digest () для обновления измененных значений модели для просмотра.

0 голосов
/ 06 июня 2018

На самом деле ваш код сгорает до: 

let startDate = new Date();
let endDate = new Date(data.endDate);
$interval(function () {
       $scope.test = Math.ceil(Math.abs(((startDate.getTime()) - (endDate.getTime())))/oneMinute)+" Minutes "+Math.ceil(Math.abs(((startDate.getTime()) - (endDate.getTime())))/oneSecond)+" s";
        console.log($scope.test);
      },1000);

Независимо от ваших вычислений, оба значения startDate и endDate являются фиксированными, и, следовательно, ваш $scope.test будет иметь постоянное значение (выигранное значениене меняются).Я думаю, что вам нужно изменить переменные, чтобы получить последнее время в интервале $ как: 

$interval(function () {
       let startDate = new Date();
       $scope.test = Math.ceil(Math.abs(((startDate.getTime()) - (endDate.getTime())))/oneMinute)+" Minutes "+Math.ceil(Math.abs(((startDate.getTime()) - (endDate.getTime())))/oneSecond)+" s";
        console.log($scope.test);
      },1000);

Этот вопрос не имеет ничего общего с областью, не обновляемой, на самом деле ваш тестзначение не меняется.

Это то, что я чувствую.Пожалуйста, поправьте меня, если я ошибаюсь.

0 голосов
/ 06 июня 2018

Инициализировать "$ scope.test;"с некоторым значением $ scope.test = 0;Если вы не инициализируете его, он останется NAN.

...