Comment initialiser le ViewModel à partir de la page (partielle) dans Durandal / ASP.NET MVC ?

Question

j'ai cette approche (génération de fichiers html à partir de cshtml).

Et Structure de répertoire standard de Durandal (rien de spécial).

Sur certaines de mes pages (partiel) J'ai ce qui suit (entre autres) (SubPage1.cshtml (référencé comme 'SubPage1.html' en 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 est ko.observable() dans mon code ViewModel)

je remplis les données en fonction de la session actuelle de l'utilisateur.C'est assez pratique à voir avec Razor.Dans ce cas, je n'ai pas besoin que les données de la liste déroulante soient présentées dans le ViewModel de mon Durandal (je veux dire toute sa liste).Cependant, je il faut que la valeur sélectionnée dans la liste déroulante soit appliquée à ViewModel (SubPage1.js) à partir de la page (lorsque la page est chargée).

Quelle est la meilleure façon (et s’il y en a) de gérer cette situation ?Je comprends sûrement qu'idéalement, je devrais charger la page comme une page statique (juste avec des liaisons Knockout), puis faire une requête ajax au serveur, puis lier les données chargées.Mais, a) utiliser la syntaxe Razor est beaucoup plus pratique et propre ;b) qui implique une requête ajax supplémentaire (et une logique de serveur supplémentaire).

---

Une autre approche que je vois consiste à informer le ViewModel que la page est chargée d'une manière ou d'une autre et à définir (probablement manuellement via javascript) la valeur actuelle de FacilityId.Comme <script type='text/javascript'> myViewModelIgetSomehow.facilityId(45); </script>.Mais cela ne semble pas non plus être la meilleure approche.

Des idées à ce sujet ?

---

C'est en fait plutôt une question de savoir comment gérer la dernière pensée mentionnée (comment transmettre certaines valeurs de la page chargée SubPage1.cshtml à ViewModel SubPage1.js) pas seulement comment gérer Razor + Durandal ViewModel.

Merci!

Answer 1

Je pense que votre meilleure option serait de créer une liaison personnalisée pour KO.Voici un exemple simple :

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());
    }
}

Vous pouvez ensuite utiliser cette liaison comme suit :

<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>

Voici un violon qui rassemble le tout.J'espère que cela pourra aider!