2017-11-07 26 views
1
 $scope.selectSample = function (name) { 
     $scope.getSample(); //GET REQUEST 

     /*SOME CODE HERE*/ 

    }; 

を次のコマンドを実行する必要があり、selectSampleは、まずそれがgetSample()の完全なサイクルを実行する必要があり、その後、コードのみ、次の実行、イベントをクリックします。今、getSample()の完了の前に、コードの他の部分が実行されています。この上の任意のソリューションですか?は、関数呼び出しの実行を完了した後、ここでコード

+0

を試すには、あなたのgetSampleの内側にあるかを示しますか? – Sajeetharan

+0

約束と非同期呼び出しの仕組みを探します。 –

+0

私たちは角度の約束を持っています。それはあなたを助けるでしょう –

答えて

1

$ scope.function()ではなくpromiseとしてGET要求を呼び出すためには、viewと対話する関数に対してのみ$ scopeを使用する必要があります。

$scope.selectSample = function (name) { 
/* call GET request as promise instead of $scope */ 
    myService.getSample(uri).then(function(result){ // $scope.getSample(); GET REQUEST 
      // after promise returns write your code 
     /*SOME CODE HERE*/ 
    }); 
}; 

myService.getSample = function(uri) { 
    return $http.get(uri).then(function (response) { 
     return response.data; // return promise 
    }); 
}; 
+0

@vedika_shrivas、この答えを確認してください –

+0

@vedika、上記はあなたが探しているものです。あなたが答えを見つけることを願っています。 –

3

JavaScriptが非同期であるために発生します。このように処理するためのさまざまな方法があります。 1) 2を約束)コールバック 3)私は例を与える

を閉鎖:あなたのケースでの約束によって

例:

var app = angular.module('myAngularApp', []); 
 
app.controller('test', function ($scope,$q) { 
 
var okToGreet= function(name){ 
 
    if(name=='Robin Hood'){ 
 
    return true; 
 
    }else{ 
 
    return false; 
 
    } 
 

 
} 
 
$scope.getSample= function(name) { 
 
    var deferred = $q.defer(); 
 

 
    setTimeout(function() { 
 
    deferred.notify('About to greet ' + name + '.'); 
 

 
    if (okToGreet(name)) { 
 
     deferred.resolve('Hello, ' + name + '!'); 
 
    } else { 
 
     deferred.reject('Greeting ' + name + ' is not allowed.'); 
 
    } 
 
    }, 1000); 
 

 
    return deferred.promise; 
 
} 
 

 

 
$scope.selectSample = function (name) { 
 
     //GET REQUEST 
 
var promise = $scope.getSample('Robin Hood'); 
 
promise.then(function(greeting) { 
 
    alert('Success: ' + greeting); 
 
}, function(reason) { 
 
    alert('Failed: ' + reason); 
 
}, function(update) { 
 
    alert('Got notification: ' + update); 
 
}); 
 
     /*SOME CODE HERE*/ 
 

 
    }; 
 
    
 
    $scope.selectSample(); 
 

 
});
<html> 
 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script> 
 
<body ng-app="myAngularApp"> 
 
<div ng-controller="test"> 
 
    
 
</div> 
 

 
</body> 
 
</html>

閉鎖による例:

var rankings = ['A', 'B', 'C']; 
for (var i = 0, len = rankings.length; i < len; i++) { 
    setTimeout(function() { 
     console.log(i, rankings[i]); 
    }, i * 1000); 
} 

アイデアは、インデックスと一緒にランキング配列のすべての名前を印刷することです。コードを非同期にするために、すべての印刷がその前身から1秒遅れる。非同期ブロックが実行された時点で、ループはまだ、終了し、あなたが見ることができるように

3 undefined 
3 undefined 
3 undefined 

:我々が得る出力は、しかし、我々はそれが

出力することが期待されるものよりも異なっています変数iの値はループを停止する値です(3)。どのようにこの動作を防止するには?答えは、Javascriptの最も強力な機能の1つであるクロージャです。クロージャは、Javascriptの保持スコープとして見ることができます.Javascriptは、それらの変数がバインドされている環境とともに独自の変数を持つことができる関数です。あなたがsetTimeout関数は、値が閉鎖定義の最後に渡されに対応している私の引数を持つクロージャ内にラップされて見ることができるように

var rankings = ['alice', 'bob', 'eve']; 
for (var i = 0, len = rankings.length; i < len; i++) { 
    (function(i) { 
    setTimeout(function() { 
     console.log(i, rankings[i]); 
    }, i * 1000); 
    })(i); 
} 

のは、クロージャを使用して、前の例を修正しましょうループvarialbe i。私たちが得られる出力は、正しいものです:

0 'A' 
1 'B' 
2 'C' 

私はあなたの問題を説明できたと思います。

0

この

$scope.selectSample = function (name) { 
     $scope.getSample(); //GET REQUEST 
    }; 

$scope.getSample = function(){ 
    $scope.yoursomecode() 
} 

$scope.yoursomecode() { 

} 
関連する問題