関数応答をKo viewmodelにリコール

Question

私のモバイルアプリは、アプリログイン時にAPIエンドポイントを読み込みます。 APIエンドポイントの1つは、DOMで見ることができるデータを返します。このデータを別のビュー/ビューモデルにロードする必要があります。データをもう一度呼び出す必要はありません。

companyDataService.jsは -

function getHelpText (companyName, userName, password) { 
     return api.helpTextGet(company.name, company.userName, company.password); 
    } 

は、私は、データが上記返却したい（これは私の見解モデルのためのアプリ上で別のビューのために必要なログイン時にロードするAPIデータエンドポイントを返します）に使用する私の関連するビューに渡すことができるように、「ヘルプテキスト」ビューモデル。ここでは私のビューモデルで試したことがあります：

}）;

これを行う方法に関するアイデアはありますか？このビューモデルで使用される事前ロードされたデータ？もし誰かがこれを助けることができれば私は約束を見て私の髪を引っ張っているように私は非常に高く評価されるだろう、q.deferなど...しかし、私はそれよりはるかに単純だと思うが、それを解決することはできない。

これが私の見解KOですからいくつかのデータを取得

<section class="help-text"> 
<div class="flex-container"> 

    <div id="no-help" class="help-content" data-bind="html: MyText"></div> 

</div> 

Answer 1

companyDataService.js -

function getHelpText(companyName, userName, password) { 
     return api.helpTextGet(company.name, company.userName, company.password).then(function (helpText) { 
      company.helpText = helpText; 
     }); 
    } 

マイビューモデル（これは私の見解モデルのためのアプリ上で別のビューのために必要なログイン時にロードするAPIデータエンドポイントを返す） -

 var MyText = ko.observable(); 

     var company = shell.authenticatedCompany(); 
     MyText(company.helpText); 




    return { 
     MyText: MyText 
}; 

Answer 2

私が正しく問題を理解していた場合、あなたは以前に自分のページ（または他のviewmodel）のAPI呼び出しを行いましたあなたのサーバー。今度は同じデータを別のビューモデルで必要とし、APIを再度呼びたくはありません。

投稿されたコードに基づいて、最初のAPI呼び出しをviewmodelから移動して（何度も何度も繰り返しないように）、代わりに呼び出しが完了したら返された値を渡すことをお勧めします。この例では

var HelpTextViewModel = function(helpMarkup){ 
    var self = this; 
    var defaultMarkup = '<div class="flex-item"><p>Request help from Support:<br /><a href="mailto:support@company.com" class="low-profile-btn btn btn-lg"><i class="fa fa-info-circle"></i>&nbsp;Contact Support</a></p></div>'; 

    //Use default text if nothing was passed in 
    //Side note - when using the knockout html binding, you can simply call myObservable(myHtml), no need to crawl the dom and set inner html. 
    self.helpText = ko.observable((helpMarkup && helpMarkup !== "") ? helpMarkup : defaultMarkup); 
}; 



$.when(myAPICallPromise).done(function(apiData){ 
    console.log("API data:", apiData); 
    ko.applyBindings(new HelpTextViewModel(apiData)); 
    //Do something else with my API data if I want to... 
}); 

Fiddle

、私はあなたが持っていたもの取って、私の観察可能なため初期値で渡す方法を追加し、何も提供されていない場合、またはそれが空白だ場合は、デフォルトを定義しました。私はまた、ビューモデルからAPIコールを移動したので、ビューモデルのみは、初期化時に渡されたものに依存しています。

APIコールでは、約束と延期をもう一度見てみることをお勧めしますが、成功コールバックでもこれを達成できます。 API呼び出しにjQueryを使用している場合はjquery.ajax() implements the promise interface by defaultです。スニペットでは、私のAPI呼び出しにjQueryの約束が使われていると仮定しています。完了したら（.done）、サーバーが私に戻ってきたものでviewmodelを初期化します。

いずれの場合でも、API呼び出しを繰り返したくない場合は、API呼び出しをviewmodelから移動し、呼び出されていることを確認してAPIが渡した値をページの別の部分に渡します。