は、それらの間にスリープ状態の2js関数を使用することはできません

私はユーザがテキストを入力する角度のフォームを作成しようとしています。は、それらの間にスリープ状態の2js関数を使用することはできません

その後、200ミリ秒間待機し、テキストlableが空白になります（「ユーザーが入力しています」が消えます）。

私は角度変更指示でそれをやっています。私のコードは以下の通りです。

問題は何らかの理由で私が2つのメソッドをスリープ状態で実行するために書いたヘルプメソッドに問題があることです。何らかの理由で、「ユーザーが入力しています...」というテキストが短い睡眠の後で消えません。

なぜですか？

おかげ

angular.module('myApp', []) 
 
.controller('myCtrl', ['$scope', function($scope) { 
 
    $scope.count = 0; 
 
    $scope.myFunc = function() { 
 
    runTwoFunctionWithSleepBetweenThem(function(){$scope.text='user is typing...';},function(){$scope.text='';},200); 
 
    }; 
 

 
    var runTwoFunctionWithSleepBetweenThem = function(foo1,foo2, time) { 
 
    var sleep =function (time) { 
 
     return new Promise((resolve) => setTimeout(resolve, time)); 
 
    } 
 
    foo1(); 
 
    sleep(time).then(() => { 
 
     foo2(); 
 
    }); 
 
    } 
 
}]);

<!DOCTYPE html> 
 
<html> 
 
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> 
 
<body ng-app="myApp"> 
 
    <div ng-controller="myCtrl"> 
 
    <p>Write something in the input field:</p> 
 
    <input type="text" ng-change="myFunc()" ng-model="myValue" /> 
 
    <p>{{text}}</p> 
 
    </div> 
 
</body> 
 
</html>

出典

2016-07-06 Matoy

'$スコープを使用しようと、タイムアウトが実行された時点で、角度範囲の外にいるあなたのコードに関連すると思われます。$ apply'あなたのタイマーコールバックの内側に... –

わかりませんが、 '$ scope.text'変数への変更を有効にするには' $ scope。$ apply（） 'を呼び出す必要があると思います。 – Titus

アンドレ・ヴァーレとタイタスはコメントで述べたように、あなたはあなたのスコープのアプリケーションサイクル外にいるので、角度は「ダーティチェック」を行うことを知りませんスコープを更新した後

var runTwoFunctionWithSleepBetweenThem=function(foo1,foo2, time) { 
    var sleep = function (time) { 
    return new Promise((resolve) => setTimeout(resolve, time)); 
    } 
    foo1(); 
    sleep(time).then(() => { 
    foo2(); 
    $scope.$apply(); 
    }); 
}

あなたsleep機能が約束ベースで$timeout、近似します。あなたは簡単に切り替え、そしてまたそれがデフォルトで$applyブロック内の関数を呼び出すという事実を利用することができます：あなたはこのが完全に約束互換作りたい場合

// Inject the $timeout service in your controller. 
var runTwoFunctionWithSleepBetweenThem=function(foo1, foo2, time) { 
    foo1(); 
    $timeout(foo2, time); 
}

、場合foo1を遅らせますそれは約束を返し、それを拒否した場合、その後、あなたはこのようにそれを修正してください可能性が中止：

// Inject $timeout and $q. 
var runTwoFunctionWithSleepBetweenThem=function(foo1, foo2, time) { 
    $q.when(foo1()).then(() => $timeout(foo2, time)); 
}

出典

2016-07-06 20:43:12

あなたは、この動作のためのサービスを定義することができます。

app.service('Sleep', Sleep); 
Sleep.$inject = [$timeout] 

function Sleep($timeout) { 
    return time =>new Promise((ok) => {$timeout(ok, time);}); 
}

使い方（後sleepとしてSleepサービスを注入）：

foo1(); 
sleep(1000).then(foo2);

出典

2016-07-06 20:57:51

あなたは_.debounceをチェックアウト後、アンダースコア使用して[OK]をしている場合。また、人々は$ scopeについて正しい。$ apply（）;

var time = 200; 
 
var func2 = _.debounce(function(){ 
 
    $scope.text = ""; 
 
    $scope.$apply(); 
 
}, time); 
 
$scope.myFunc = function() { 
 
    $scope.text='user is typing...'; 
 
    func2(); 
 
};

出典

2016-07-06 21:02:04 curtainrising

は、それらの間にスリープ状態の2js関数を使用することはできません

答えて

関連する問題