AngularJS có giúp ích gì khi truy cập vào trang web của tôi không?

Question

Tôi có một ứng dụng sử dụng Angular ui-router. Khi bộ định tuyến được đặt ở một trạng thái nhất định, tôi muốn đặt bộ hẹn giờ thành ví dụ 2 giờ. Trong khi nó được đặt thành một trạng thái khác, tôi muốn đếm số đếm ngược. Tôi muốn có thời gian hiển thị còn lại trên màn hình của tôi.

Có ai có bất kỳ ví dụ mã nào về cách tôi có thể thực hiện chức năng này không? Nếu bất cứ ai đã làm điều gì đó tương tự, tôi sẽ đánh giá cao bất kỳ lời khuyên nào mà họ có thể đưa ra.

Answer 1

Tôi hiện đang sử dụng một dịch vụ đếm ngược cho mục đích này trong dự án của tôi. theo yêu cầu của bạn, bạn có thể sử dụng dịch vụ như dưới đây:

1. bắt đầu init nó trên đầu trang

   app.controller('view1Ctrl', function($scope, $csCountdown){ 
       $csCountdown.init(2 * 3600); // 2 hours 
       $scope.countdown = $csCountdown.data; 
   }) 
   

2. bắt đầu truy cập vào thứ hai trang

   app.controller('view2Ctrl', function($scope, $csCountdown){ 
       $csCountdown.start(); 
       $scope.countdown = $csCountdown.data; 
   }) 
   

bạn có thể hiển thị giá trị trên bất kỳ trang nào bằng cách sử dụng countdown.stringValue

<h1>Time : {{countdown.stringValue}}</h1> 

bạn có thể thấy nó hoạt động PLUNKER LINK. Tôi đã tạo view1 & view2 với hoạt ảnh chuyển tiếp.

EDIT

Tôi có cập nhật PLUNKER 2 để có một ví dụ thực tế.

1. Ban đầu bạn sẽ thấy trang hướng dẫn, nơi bộ hẹn giờ được khởi tạo đến 2 giờ.

2. Sau đó chuyển sang câu hỏi 1, nơi hẹn giờ bắt đầu

3. từ câu hỏi 1 bạn có thể vào trang trợ giúp, nơi mà các bộ đếm thời gian tạm dừng

4. sau đó bạn quay trở lại câu hỏi 2, nơi hẹn giờ hồ sơ. ..

Answer 2

Bạn có thể kết hợp dịch vụ và chỉ thị cho mục đích này. Dịch vụ sử dụng cookie để lưu trữ giá trị đếm ngược. Vì vậy, nó sẽ tiếp tục đếm ngay cả sau khi làm mới.

Bạn có thể bắt đầu hoặc ngừng đếm ngược từ điều khiển:

CountdownService.startCounting(3 * 30 * 1000); // milliseconds 

Sau đó hiển thị thời gian còn lại từ một chỉ thị trong mẫu:

<countdown></countdown> 

Ngoài ra bạn có thể thay đổi phong cách của chỉ thị từ mẫu .

Kiểm tra của tôi plunker ...