ここにあるDurandalドキュメントでモジュールを作成するために与えられた例に従っています: http://durandaljs.com/documentation/Creating-A-Module/
promise オブジェクトが監視可能な配列を更新しない理由がわかりません。これが私がこれまでに持っているものです:
main.js
requirejs.config({
paths: {
'text': 'durandal/amd/text'
},
urlArgs: "bust=" + (new Date()).getTime() //this is a cache buster for js, remove before deployment
});
define(['durandal/app', 'durandal/viewLocator', 'durandal/system', 'durandal/plugins/router', 'lib/utils', 'lib/config', 'lib/backend'],
function(app, viewLocator, system, router, utils, config, backend) {
system.debug(true);
var Backend = backend;
window.service = new Backend(config.service_url);
app.title = 'Huddle';
app.start().then(function() {
viewLocator.useConvention();
router.useConvention();
router.mapRoute('projects', 'viewmodels/projects/list', 'Projects', true);
app.adaptToDevice();
app.setRoot('viewmodels/shell', 'entrance');
});
});
ビューモデル/プロジェクト/list.js
define(function (){
return {
projects: ko.observableArray([]),
activate: function () {
var self = this;
return service.getProjects().then( function ( jqxhr ){
self.projects(jqxhr);
});
}
};
});
ビュー/プロジェクト/list.html
<section class="projects-list" data-bind="widget: { kind: 'sortable_table', items: projects }">
lib/backend.js
define(function(require){
var backend = function (service_url) {
this.url = service_url;
};
backend.prototype.getProjects = function(){
var jqxhr = $.getJSON(this.url+'/projects');
return jqxhr;
};
return backend;
});
サービスコール応答
{
"projects": [
{
"id": <project id>,
"title": "Project One",
"description":"This is a description",
"created_by": <user_id>,
"created_date": "12341234",
"modified_by": <user_id>,
"modified_date": "12341234",
"favorite": true,
"users": [
<user id>,
<user id>,
<user id>
]
},
{
"id": <project id>,
"title": "Project Two",
"description":"This is a description",
"created_by": <user_id>,
"created_date": "12341234",
"modified_by": <user_id>,
"modified_date": "12341234",
"modified_by": 394839248239,
"favorite": true,
"users": [
<user id>,
<user id>,
<user id>
],
"favorite": true
},
{
"id": <project id>,
"title": "Project Three",
"description":"This is a description",
"created_by": <user_id>,
"created_date": "12341234",
"modified_by": <user_id>,
"modified_date": "12341234",
"favorite": true,
"users": [
<user id>,
<user id>,
<user id>
]
}
],
"archived_project_count": 10
}
then
バックエンドによって行われたサービス呼び出しが正常に完了していることに気付きました (Chome Inspector の [ネットワーク] タブを見ると) が、呼び出されたブロックでは何も実行されていないようですviewmodels/projects/list.js
(console.log( を追加してこれをテストしました) "i'm here") の前の行self.projects(jqxhr)
。 に変更しようとしthen
ましdone
たが、まだ何もありません。代わりに、コンソールに jqxhr オブジェクトが表示され、その後に "Cancelling Navigation" が表示されます。
補足として、アプリ全体で main.js に設定された変数にアクセスできるようにするための、Durandal 内のより良い規則があるかどうかも疑問に思っています。これまでのところ、使用する必要がありましたwindow.service = [Object]
が、別の方法が利用可能であるように思われます。main.js の utils と config で行ったようにバックエンドをセットアップしようと考えていましたが、そもそもバックエンドを作成するには構成値が必要なので、それはオプションではないと考えました。
どんな助けでも大歓迎です!