2013-03-06 13 views
5

私はおそらく、MVCの最も熟練していない人ですが、ホットタオルSPAはもちろんのこと、これらの技術について。ASP.NET MVC 4でSPAホットタオルテンプレートでローカルデータベースを使用する方法

私はBreezeのウェブサイトとJohn Papaのドキュメントをすべて読んだことがありますが、私のデータベースとのやりとりを作成し、データを表示してデータを表示する方法、データの削除を含むデータを追加または編集する方法はわかりません。

ライブデータが表示されている画面に約5グリッドのダッシュボードを作成する必要があります。

これまで私が2日間行ってきたのは、ホットタオルのテンプレートを変更してプロジェクト名を表示し、ホットタオルアイコンを変更したことです。私はこのようなものの周りに私の頭を包み込むことはできません...私は3層アーキテクチャのASP.NET Webサイトの開発者でした。

誰でも私にこのテンプレートを通してデータを渡す方法に関するガイドラインを教えていただけますか?

+0

私は同じ船に乗ってよ、あなたは全く同じように感じるが...方向を向いていると前方に移動することは困難だと、今これらの事を行うには非常に多くの方法があるようです。 –

答えて

6

私はHot Towel SPAから始めましたが、ここで見つけることができるDurandal MovieAppサンプルのような他の参考文献を使用しました。 http://stephenwalther.com/archive/2013/02/08/using-durandal-to-create-single-page-apps.aspx。 サンプルを含むbreezejsランタイムもダウンロードして見直しました。

私のシナリオでは、SQLを使用してEntity Frameworkを使用し、WEBAPIコントローラを作成し、breezejsのドキュメントに従いました。私のコントローラを除いて、以下の通りです。

[BreezeController] 
public class ProjectBillingController : ApiController 
{ 
    readonly EFContextProvider<ProjectBillingContext> _contextProvider = 
    new EFContextProvider<ProjectBillingContext>(); 

    // ~/api/todos/Metadata 
    [HttpGet] 
    public string Metadata() 
    { 
     return _contextProvider.Metadata(); 
    } 


    [HttpPost] 
    public SaveResult SaveChanges(JObject saveBundle) 
    { 
     return _contextProvider.SaveChanges(saveBundle); 
    } 

    [HttpGet] 
    public IQueryable<Client> Clients() 
    { 
     return _contextProvider.Context.Clients; 
    } 
    ... 

私はそれがどんな複雑なクエリではなかったので、私はそのAものの、私のために、1つのリポジトリを使用デュランダル作品APPのコード&ディレクトリ構造私の場合は

/App 
/App/respositories 
/App/repositories/repository.js 
/App/viewmodels 
/App/viewmodels/clients 
/App/viewmodels/clients/show.js 
/App/viewmodels/clients/edit.js 
/App/viewmodels/clients/create.js 
/App/views/clients 
/App/views/clients/show.html 
/App/views/clients/edit.html 
/App/views/clients/create.html 

を真似してみました開始。

私のリポジトリ内には、定義されたbreezejsエンティティマネージャと、すべての行と1行を取得する関数があります。コードの抜粋は以下の通りです。

// repository.js 
function getRecordLists(modelsListsObservable, errorObservable, entity) { 

    return breeze.EntityQuery 
    .from(entity) 
    .using(manager).execute() 
    .then(querySucceeded) 
    .fail(queryFailed); 

    function querySucceeded(data) { 
     modelsListsObservable(data.results); 
     logger.log('Fetched ' + entity, null, null, true); 

    } 

    function queryFailed(error) { 
     errorObservable("Error retrieving" + entity + " : " + error.message); 
     logger.error("Error retrieving" + entity + " : " + error.message, null, null, true); 

    } 
}; 


function getRecord(id, clientObservable, errorObservable, entity, entityKey) { 
    return breeze.EntityQuery.from(entity) 
    .where(entityKey, "==", id) 
    .using(manager).execute() 
    .then(querySucceeded) 
    .fail(queryFailed); 

    function querySucceeded(data) { 
     clientObservable(data.results[0]); 
     logger.log('Fetched a record from ' + entity, null, null, true); 
    } 

    function queryFailed(error) { 
     errorObservable("Error retrieving a record from " + entity + ": " + error.message); 
     logger.error("Error retrieving a record from " + entity + ": " + error.message, null, null, true); 
    } 

}; 

// show.js 
define(function (require) { 

    var repository = require("repositories/repository"); 
    var app = require('durandal/app'); 
    var router = require("durandal/plugins/router"); 
    var logger = require('services/logger'); 
    var models = ko.observableArray(); 
    var error = ko.observable(); 

    return { 
     models: models, 
     error: error, 
     deleteRecord: deleteRecord, 

     activate: function (data) { 
      return repository.getRecordLists(models, error, "Resources"); 
     } 
    }; 

私はこれが少し役に立ちますと願っています。私もこれを学んでおり、その中のいくつかはベストプラクティスではないかもしれませんが、私が学ぶには十分です。

おかげ

+0

これはありがとうございました。今週は鶏肉のように走り回っていましたが、月曜日にこれを見ていきました。 –

関連する問題