連鎖したAJAXコールの条件付きロジック

Question

私は複数の保存されたInstagramフィードから投稿を読み込むページを持っています。フィードオブジェクトは、次のようになります。

{'feed_type' : 'search', 'feed_term' : '#cars'} 
{'feed_type' : 'profile', 'feed_term' : 'FerrariOfficial'} 

フィードはInstagramのプロファイルではなく、ハッシュタグに関連する場合、我々は（Instagramのユーザー名で照会することはできませんので）最初にそのユーザ名のIDのためのInstagramのAPIを照会する必要があります。

新しいフィードを追加するフォームもページにあります。フィードを追加すると、これらのチェックとメソッドの表示を再利用したいと考えています。

私は、次の機能があります。

getInstagramIdFromUsername() 
displayPosts() 
addNewFeed() 

理想的にはこれがメインロジックのようになります。すべてのこれらの関数は非同期AJAX呼び出しているように私は私のロジックを構築するトラブルを抱えているが

onLoad() { 
    // for each feed... 
    if (f.feed_type == "profile") { 
     getInstagramIdFromUsername(f); 
    } 
    displayPosts(f); 
} 

onAddFeedFormSubmitted(f) { 
    if (f.feed_type == "profile") { 
     getInstagramIdFromUsername(f); 
    } 
    addNewFeed(f); 
    displayPosts(f); 
} 

。これを行う最善の方法は何ですか？ jQueryのDeferred Objectをここで使用する必要がありますか？

Answer 1

関数が非同期の場合は、コールバック機能を追加する必要があります。それはフィードを取得した後

getInstagramIdFromUsername(callback) 

コールバックが実行されますので、あなたはちょうどそうのように行くことができます：

onLoad() { 
    if (feed_type == "profile") { 
     getInstagramIdFromUsername(function() {displayPosts();}); 
    } else { 
     displayPosts(); 
    } 
} 

Answer 2

あなたは、単に$アヤックス関数によって返されるオブジェクトを返すことができます。そのA繰延オブジェクト：

onLoad() { 
// for each feed... 
if (f.feed_type == "profile") { 
    getInstagramIdFromUsername(f).done(function(data){ 
     displayPosts(f); 
    }); 
}else{ 
    displayPosts(f); 
} 

} 

onAddFeedFormSubmitted(f) { 
if (f.feed_type == "profile") { 
    getInstagramIdFromUsername(f).done(function(data){ 
    addNewFeed(f); 
    displayPosts(f); 
}); 
}else{ 

} 
} 

だからあなたgetInstagramFromUsername機能は次のようになります。

function getInstagramIdFromUsername(){ 
    return $.ajax({ 
     url:"api/" 
    }); 
} 

カスタムデータ型のより高度な動作を実装することができます。 http://api.jquery.com/jquery.ajax/