2016-06-15 3 views
1

일부 사용자가 설정 한 값에서 타이머가 카운트 다운됩니다. 분으로 처리되는 숫자를 입력합니다. number * 1000 * 60을 milliseconds로 변환하면 카운터가 카운트 다운하고이 숫자를 감소시킵니다.AngularJS 필터로 시간을 포맷하는 방법은 무엇입니까?

내가 원하는 것은이 숫자를 분과 초로 형식화하므로 입력 된 숫자가 3.5 인 경우 03:30으로 표시되어야합니다.

각도로 제공되는 날짜 필터를 사용해 보았지만 타이머 값과 동기화되지 않았습니다. 그것은 한 번 감소하고 멈출 것입니다.

코드 :

<h4 class="timer">{{ vm.timer.ticks | date: "mm:ss"}}</h4> 

타이머에 대한 배경 서비스

start(duration) { 
    this.ticks = duration; 
    this.timer = this.$interval(() => { 
    if (this.ticks === 0) return this.stop(); 
    this.ticks--; 
    }, 1000); 
} 

답변

0

이 좋아, 그래서 ... 나는 끔찍한 실수를 $로 시청 : (! 안된)로 재 작성하려고합니다. 서비스에서 내 변수를 감시하고 그에 따라 다른 변수를 변경하고있었습니다.

$scope.$watch('vm.timer.ticks', value => { 
    if (value <= 0) { 
    vm.timer.count = 0; 
    vm.timer.latest = ''; 
    } 
    if(vm.timer.ticks > 0) { 
    seconds = vm.timer.ticks % 60; 
    minutes = Math.floor(vm.timer.ticks/60); 
    filledMinutes = minutes < 10 ? "0" + minutes : minutes; 
    filledSeconds = seconds < 10 ? "0" + seconds : seconds; 
    vm.displayTime = filledMinutes + ':' + filledSeconds; 
    } else { 
    vm.displayTime = '00:00'; 
    } 
}); 
0

나는 당신이 당신의 내부 함수에서 "이"숨어 있기 때문에 생각입니다. 내가 시간을 계산할 때 나는 $ 범위를 설정

...

start(duration) { 
    var ticks = duration; 
    this.timer = this.$interval(() => { 
    if (ticks === 0) return this.stop(); 
    ticks--; 
    }, 1000); 
} 
+0

는 자사가이 that' 대, 화살표 기능은 내가 그 변수에 액세스 할 수 있기 때문에 문제가되지 않습니다 여기에 트릭 .. –

+0

일을'관련이 없습니다. const vm = this; vm.timer = TimerService; 그런 다음 vm.timer.ticks를 통해 변수에 액세스합니다. 서식을 지정하는 것이 문제이며 데이터 수신 부분은 정상입니다. – Darko

관련 문제