クライアントが自分自身を変えることができるイオンタイマーを作る方法は？

Question

私がセンターをクリックすると、私は何分か何秒ででもタイマーを途中で変えると思っています。ハードコーディングされた1分タイマーではなく、どうしたらいいですか？

http://codepen.io/comapedrosa/pen/ONYgzJ

// When you press a timer button this function is called 
$scope.selectTimer = function() { 
    $scope.timeForTimer = 60; 
    $scope.timer = 60; 

Answer 1

私はあなたが望む方法を実装することができますあなたのために少し例を作りました。基本的には、変更する必要があるいくつかのものだけです。

この例では、時間（秒）を設定できる簡単な入力を行いました。入力は、ヘッダの左上に見つけることができ、このように見えます：

<input class="time" type="number" ng-model="timerTime" placeholder="Set time" ng-change="selectTimer()"/> 

クラスはちょうどそれが少し見た目が良く、背景から目立つ作るためですが、あなたが本当に必要なのはng-modelですおよびng-change。 ng-modelは、タイマーが値として使用するためにタイマーの範囲で更新されるモデルであり、ng-modelが変更されたときにタイマーを「リロード」する機能がng-changeにあります。

ng-change我々の

$scope.selectTimer = function() { 
    $scope.timeForTimer = $scope.timerTime; 
    $scope.timer = $scope.timerTime; 
}; 

そして最後に：次に、あなたがで正しい関数にこの値を割り当てる必要が

$scope.timerTime = 60; 

：私は、タイマーの初期値を設定するコントローラで

$scope.selectTimerを呼び出すと、タイマー自体が入力に挿入された値で更新されます。

タイマーが動作しているときに入力を無効にすることができます。リセットしないと、プロセスが壊れません。これは、たとえポップアップであっても、時間の最終設定を実装しようとしているものであっても、おそらく実行する必要があります。

しかし、私が言ったように、これを実装する方法がわからないので、この例をこのように単純化しました。必要に応じて使用してください。

コーデパンデモは、ここにあります。http://codepen.io/thepio/pen/PzyPxk