Невозможно получить несколько моделей представления при работе мастера ViewModel в Durandal.JS

Question

Я работаю над приложением, которое имеет DurandalJS 2.0.1. Я написал модель представления, в основном я хочу реализовать основную модель представления, которая имеет несколько моделей представления (например, учетная модель представления учетной записи имеет регистрационные и входные подчиненные модели представления)

define(['knockout'],function (ko) {

    var register = function(){
        var self = this;
        self.Welcome = "Register";
        self.Username = ko.observable();
        self.Password = ko.observable();

    }
    var login= function(){
        var self = this;
        self.Welcome = "Login";
        self.Username = ko.observable();
        self.Password = ko.observable();
    }   
    var account = {
        testVariable : "Hello Cruel World!",
        register : register,
        login : login
    };

    return account;

});

Вид это:

<h2 data-bind="text: testVariable"></h2>
<h2 data-bind = "text: register().Welcome"></h2>
<h2 data-bind = "text: login().Welcome"></h2>

testVariable отображается правильно, но я не могу сделать register().Welcome, login().Welcome или пытался register.Welcome или же login.Welcome за работой.

Любая идея, как я могу заставить это работать?

Answer 1

Вот как вы можете справиться с такими ситуациями... @robert.westerlund прав, если это функция, то вы должны создать новый объект каждой функции, прежде чем продолжить..

define(['plugins/http', 'durandal/app', 'jquery', 'knockout'], function (http, app, $, ko) {



    var loginVM = {
        Welcome : "Hello Login",
        Username : ko.observable(),
        Password : ko.observable(),
        rememberMe : ko.observable(false),

        Login : function (obj, event) {
              //Do the login stuff
        }
    };

    var registerVM = {
        Welcome : "Hello Register",
        Username : ko.observable(),
        Password : ko.observable(),
        ConfirmPassword : ko.observable(),

        Register : function (obj, event) {
              //Do the register stuff
        }
};

    return {
        login : loginVM,
        register: registerVM
    };


});

ПОСМОТРЕТЬ

<div data-bind="with:login">
     <h2 data-bind = "text: Welcome"></h2>
</div>
<div data-bind="with:register">
     <h2 data-bind = "text: Welcome"></h2>
</div>

Вместо написания функций я написал объектные литералы. Это сработало довольно хорошо:-)