2

asp.net mvc SPA の durandaljs を調査しています。APS.net MVC4、Durandaljs、Knockoutjs、breeze、moment、および hottowel SPA サンプルの下にあるその他のライブラリを使用しています。

DOB、DateTime にバインドされたクライアント ビューがあります。

    <td colspan="2">
                    <span id="dob" data-bind="text: DOB"></span>
            </td>                                                

私のViewModelにはコードが含まれています

    vm.studentProfile().DOB(moment(vm.studentProfile().DOB()).format('L'));
        logger.log(vm.studentProfile().DOB(), null, system.getModuleId(vm), false);

上記のコードは実際には querySucceeded から来ています。すなわち

    return manager
        .executeQuery(query)
        .then(querySucceeded)
        .fail(queryFailed);

これは、他のいくつかのフィールドですでにこれを達成しているため、機能していると思われますが、DateTime KnockoutOut の場合、GUI は更新されませんが、コンソール ログに UPDATED 形式の日付が表示されます。ここで何が欠けているのか誰か教えてください。前もって感謝します。

4

2 に答える 2

1

問題は、DOB がMomentJsJavaScriptDateや文字列ではなく日付であるという事実にある可能性があります。これらの日付を表示するには、次のようなカスタム バインディング ハンドラーを追加する必要があります。

ko.bindingHandlers.moment = {
            update: function(element, valueAccessor) {
                var value = valueAccessor();
                var formattedValue = ko.utils.unwrapObservable(value).format('LLLL');
                $(element).text(formattedValue);
            }
};

ここで、「テキスト」バインディング ハンドラーを使用する代わりに、次のように「瞬間」バインディング ハンドラーを使用します。

<span id="dob" data-bind="moment: DOB"></span>

編集:RequireJSでAMDモジュールを使用してカスタムプラグインを追加する例を追加しました:

require(['jquery', 'json2', 'sammy', 'amplify', 'bootstrap', 'moment', 'toastr', 'showdown', 'markdowneditor', 'spin'], 
        function($){

        // Require that plugins be loaded, after the prerequisite libraries
        //       We load the plugins here and now so that we don't have to 
        //       name them specifically in the modules that use them because
        //       we don't want those modules to know that they use plugins.
        requirejs([
                'jquery.ui',                // jquery plugin
                'jquery.mockjson',          // jquery plugin
                'jquery.tmpl',          // jquery plugin
            ], 
            function () { 
                require(['ko'],
                    function(ko) {
                        // ensure KO is in the global namespace ('this') 
                        if (!this.ko) {
                            this.ko = ko;
                        };

                        requirejs([
                                'libs/knockout.binding.handlers',       // Knockout custom binding handlers
                                'libs/knockout.extenders',       // Knockout custom binding handlers
                                'libs/bootstrap.extenders',       // Knockout custom binding handlers
                            ],
                            // Plugins generally don't return module objects
                            // so there would be point in passing parameters to the function
                            function () { 
                                require(['app'], function(App) {
                                    App.initialize(); 
                                });
                            }
                        );
                    }
                );
            }
        );
    }
);
于 2013-05-14T16:39:51.030 に答える