0

보기 및 모달에서 동일한 타이머를 가져 오려고합니다. 같은 범위와 모두 작업 :범위 각도 모달 및 각도 타이머 지시문

$scope.openTimer = function() { 
var modalInstance = null; 
modalInstance = $modal.open({ 
    templateUrl: 'modal-timer.html', 
    controller: 'ModalTimerController', 
    scope: $scope, 
    backdrop: 'static', 
    size: "sm" 
}); 
modalInstance.result.then(function() { 
    console.log('onCloseModal'); 
}); 
} 

여기 내 plunker입니다.

문제는 뷰와 모달간에 실행 시간 (타이머 지시문에서 오는)을 공유 할 수 없다는 것입니다. 모달은 항상 재설정 타이머로 열립니다.

보기 및 모달에서 정확히 동일한 타이머 실행 시간을 공유 할 수있는 방법이 있습니까?

답변

0

타이머 기능에 서비스를 사용할 수 있습니다.

https://docs.angularjs.org/guide/services

나는 서비스에서 범위에 당신의 모든 기능을 이동 한 다음은 현재 시간을 표시 범위를 사용합니다. 이 방법으로 서비스를 컨트롤러에 삽입 할 수 있으며 컨트롤러는 정보를 표시 할 책임 만 있습니다. 서비스는 싱글 톤 (singleton)입니다. 즉, 인스턴스가 하나만 존재한다는 것입니다. 그래서 그것이 어떤 상태에 있든 그것은 주입 된 모든 컨트롤러 사이에서 공유 될 것입니다.

그것은 (TimeService는 컨트롤러에서 현재 코드를 보유) 같은 것을 보일 것이다 : 물론

controller: ['$scope', '$element', 'TimeService', 
    function($scope, $element, TimeService) { 
    $scope.timeDisplay = TimeService.currentTime; 
    } 
] 

, 당신은 서비스를 작성해야 것, 그리고 그것의 계산은 currentTime을에 값을 할당해야 .

+1

내가 올바르게 구현할 수 있도록 귀하가 말한 내용 [이] (http://www.bennadel.com/blog/2674-creating-a-reusable-timer-in-angularjs.htm)을 사용했습니다. 모든 것이 내가 원하는대로 작동합니다. 나는 여기에 각진 [http://louisamoros.github.io/angular-timer/#/home]을위한 다른 지시자/서비스 타이머를 구현하기 시작했다. –