2016-03-25 17 views
1

ちょっと面白いですが、いくつか問題があります。 私はng-modelとexample-directiveを持っています。

<input ng-model="model" type="text" class="form-control"> 
 
<div example-dir test="model"></div>

私は$タイムアウトを開始するディレクティブに入力し、このモデルから、それぞれの新しいヴァルから我々のモデルを渡したいが、最初の新しいvalは$タイムアウトを開始する必要があります が、それぞれ次の新しいvalは$ timeoutを再起動する必要があります。

たとえば、データを渡して$ timeout begin start(eaxmpleの場合は1000ミリ秒)を入力しますが、次の各データは$ timeoutを0に再スタートさせてから再びスタートしなければなりません。

私のディレクティブコードがあります:

function link(scope, element, attr) { 
 
     
 
     scope.$watch('test',function(nval){ 
 
     var timeout; 
 
     function incrementTimer(){ 
 
      //some stuff 
 
     } 
 
      if(nval){ 
 

 

 
       timeout = $timeout(incrementTimer, 1000); 
 
       $timeout.cancel(timeout); 
 

 
      } 
 
     }); 
 
        
 
      
 
    }

私はアイデアとパス$タイムアウトを持っているとcorectly作業にキャンセルいけません。 ありがとうございます。

答えて

2

あなたがやっていることは、各反復でtimeout変数を再宣言していることです。リンク機能でタイムアウトを宣言して、それをリセットします。驚くほど簡単な答えのための

link: function (scope) { 
    function myFunc() { console.log('tick'); }  
    var timeout; 

    scope.$watch(function() { 
     return scope.test; 
    }, function (newVal, oldVal) { 
     if (timeout) { 
      $timeout.cancel(timeout); 
     } 
     timeout = $timeout(myFunc, 1000); 
    }); 
} 

Fiddle

+1

ありがとう! –

+0

スコープが$ watchの値が空であるかどうかを調べる方法を教えてください。 –

+0

@JanKowalskiあなたは 'newVal'と' oldVal'を持っています。 'if(!newVal){// value is empty}'の更新された値チェックをしたい場合は ' –