كيفية تهيئة ViewModel من (جزئي) صفحة في Durandal / ASP.NET MVC?

Question

لدي هذا النهج (توليد ملفات html من cshtml).

و Durandal القياسية بنية الدليل (شيء خاص).

على بعض صفحات (جزئية واحدة) أنا (بين أمور أخرى) (SubPage1.cshtml (المشار إليها باسم 'SubPage1.html في durandal)):

...
<select data-bind="event: { change: doSomething }, value: facilityId">
        <option value="0">Any Facility</option>

        @foreach (var facility in Data.CurrentUserFacilities())
        {
            <option value="@facility.FacilityId" selected="@CertainCondition">@facility.FacilityName</option>
        }
</select>
...

(facilityId هو ko.observable() في ViewModel رمز)

أنا ملء البيانات بالاعتماد على المستخدم الحالي الدورة.هذا مريحة جدا علاقة شائكة.في هذه الحالة لا تحتاج البيانات من القائمة المنسدلة التي ستعرض في Durandal هو ViewModel (يعني كل قائمة).ومع ذلك, أنا هل تحتاج إلى القائمة المنسدلة اختيار القيمة التي يمكن تطبيقها على ViewModel (SubPage1.js) من صفحة (عند تحميل الصفحة).

ما هي أفضل طريقة (و إذا كان هناك أي) للتعامل مع هذا الوضع ؟ أنا بالتأكيد أفهم أنه من الناحية المثالية يجب تحميل الصفحة كما هو ثابت واحد (فقط مع خروج المغلوب الارتباطات) ، ثم القيام ببعض اياكس طلب إلى الملقم ثم ربط البيانات وتحميلها.ولكن أ) باستخدام الشفرة جملة هو أكثر من ذلك بكثير مريحة و نظيفة.ب) أن يتضمن إضافية طلب اياكس (و ملقم إضافية المنطق).

---

نهج آخر أراه هو أن يخطر ViewModel عن تحميل الصفحة بطريقة أو بأخرى و مجموعة (ربما يدويا عن طريق جافا سكريبت) في facilityId القيمة الحالية.مثل <script type='text/javascript'> myViewModelIgetSomehow.facilityId(45); </script>.ولكن كما يبدو ليس أفضل نهج.

أي أفكار عن ذلك ؟

---

هذا سؤال كيفية التعامل مع الماضي ذكر الفكر (كيفية تمرير بعض القيم من صفحة تحميل SubPage1.cshtml إلى ViewModel SubPage1.js) ليس فقط كيفية التعامل مع الحلاقة + Durandal ViewModel.

شكرا لك!

Answer 1

أعتقد أن الخيار الأفضل أن يكون على خلق العرف ملزم على خروج المغلوب.وهنا مثال بسيط:

ko.bindingHandlers["serverCombo"] = {
    init: function (element, valueAccessor) {
        var $element = $(element);

        var options = ko.unwrap(valueAccessor());
        var observableTarget = options.value;

        $element.change(function onElementChanged() {
            var newValue = $element.val();
            observableTarget(newValue);                
        });
    },

    update: function (element, valueAccessor) {
        var $element = $(element);

        var options = ko.unwrap(valueAccessor());
        var observableTarget = options.value;

        $element.val(observableTarget());
    }
}

ثم يمكن استخدام هذه الملزمة على النحو التالي:

<select data-bind="serverCombo: { value: facilityId }">
    <option value="1">The Deck</option>
    <option value="2">The Pool</option>
    <option value="3">The Shagpile Carpet and Mirrored Ceiling room</option>
</select>

وهنا كمان الأمر الذي يضع كل شيء معا.على أمل أن يساعد!