Введите номер и отобразите его в формате «hh: mm: ss»/time в AngularJS

Im делает функцию в моем приложении, когда при вводе определенного номера отобразится формат hh: mm: ss и начнется подсчет вниз. Номер ввода будет обрабатываться как минуты, например, когда я ввожу 2, дисплей будет 00:02:00, после чего он начнет отсчет.Введите номер и отобразите его в формате «hh: mm: ss»/time в AngularJS

<body ng-app="mehmetcankerApp"> 
<!--counterCtrl App Controller --> 
<div ng-controller="counterCtrl"> 
<!--Angular Binding --> 
<input type="number" ng-model="counter"/> 
<p ng-model="format" ng-bind="counter" id="numOfDozens"></p> 
    <button ng-click="stop()">Stop</button> 
    <button ng-click="countdown()">Start</button>  
</div>

Весь код в этой ссылке plnker: http://plnkr.co/edit/Mzv6W9smmRkaDPU4cgVa?p=preview

источник

2016-02-02 bleykFaust

Вы должны использовать пользовательский фильтр и интервал:

var app = angular.module('app', []); 
 

 
app.controller('counterCtrl', ['$scope', '$interval', 
 

 
    function($scope, $interval) { 
 
    $scope.minutes = 0; 
 
    $scope.seconds = $scope.minutes * 60; 
 
    $scope.$watch('minutes', function() { 
 
     $scope.seconds = $scope.minutes * 60; 
 
    }); 
 

 
    $scope.countdown = function() { 
 
     if ($scope.seconds <= 0) return; 
 
     $scope.countdownInterval = $interval(function() { 
 
     if ($scope.seconds <= 0) { 
 
      $interval.cancel(countdownInterval); 
 
     } 
 
     $scope.seconds--; 
 
     }, 1000); 
 
    }; 
 
    
 
    $scope.stop = function() { 
 
     $interval.cancel($scope.countdownInterval); 
 
    }; 
 

 

 
    } 
 

 

 
]); 
 

 
app.filter('secondsToDate', [ 
 
    function() { 
 
    return function(seconds) { 
 
     return new Date(1970, 0, 1).setSeconds(seconds); 
 
    }; 
 
    } 
 
])

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.9/angular.min.js"></script> 
 
<div ng-app="app"> 
 
    <div ng-controller="counterCtrl"> 
 
    <!--Angular Binding --> 
 
    <input type="number" ng-model="minutes" /> 
 
    <p id="numOfDozens">{{seconds | secondsToDate | date:'HH:mm:ss'}}</p> 
 
    <button ng-click="stop()">Stop</button> 
 
    <button ng-click="countdown()">Start</button> 
 
    </div> 
 
</div>

источник

2016-02-02 06:22:59 Daniel

спасибо @Daniel :) – bleykFaust

Working Demo

Здесь вы можете увидеть, что я создал функцию, чтобы получить дату образца с точным временем введенного текста (счетчик).

{{getMyTime() | date: 'HH:mm:ss'}}

getMyTime() возвращает дату образца с правильным временем и форматировал его с датой фильтром.

$scope.getMyTime = function(){ 
    var myTime = new Date(01,01,01); 
    myTime.setMinutes($scope.counter); 
    return myTime; 
}

Надеюсь, это вам поможет.

Пожалуйста, не стесняйтесь спрашивать об этом !!!

источник

2016-02-02 06:20:52

Введите номер и отобразите его в формате «hh: mm: ss»/time в AngularJS

ответ

Смежные вопросы