使用 JQuery 淘汰多个 ViewModel

Question

我有这个Fiddle

它在小提琴中完美运行，但是一旦我将所有内容放入 ASP.NET MVC4 应用程序中，第二个 ViewModel 就没有加载！ 这通常仅在我将以下脚本标记添加到我的项目时才发生

<script src="../../Scripts/jquery.mobile-1.2.0.js" type="text/javascript"></script>

我需要一些 JQuery 函数来加载第二个 ViewModel 还是我做错了什么？ ;)

这是我的代码：

<form action="" data-bind=" template:{ 'if': loginVM, data: loginVM }"> 
 //SomeCode
</form>

<form action="" data-bind=" template:{ 'if': startVM, data: startVM}"> 
//Some Code
</form>

<script type="text/javascript">

        var masterViewModel = {

            loginVM: ko.observable(),
            startVM: ko.observable(),
            projektUnterbrechen: ko.observable(),
            logout : ko.observable(),
            projectStartVM: ko.observable()

        };

        var LoginVM = function () {
            var self = this;
            self.mandant = ko.observable();
            self.user = ko.observable();
            self.password = ko.observable();
            self.showDetails = function () {
                if ((self.user() == "Gregor") && (self.password() == "gregrech")) {
                    masterViewModel.loginVM(null);
                    masterViewModel.startVM(new StartVM());
                    **//alert(masterViewModel.startVM()!=null) //==True** 


                }
                else {
                    alert("Username oder Passwort falsch");
                }

            };
        };

        var StartVM = function () {
            self = this;
            **//alert(masterViewModel.startVM()!=null) //==False**
            //Um weiterzumachen muss man eingeloggt sein
            self.favoriten = ko.observableArray([
                {
                    projectName: "Favorit1"
                },
                {
                    projectName: "Favorit2"
                },
                {
                    projectName: "Favorit3"
                }
                ]);
            //Die zuletzt verwendeten Projekte
            self.zuletzt = ko.observableArray([
            {
                lastProjName: "Zuletzt1"
            },
            {
                lastProjName: "Zuletzt2"
            },
            {
                lastProjName: "Zuletzt3"
            }
            ]);
            self.showStart = function (projectName, data, event) {
                masterViewModel.projectStartVM(new ProjectStartVM(projectName));
                masterViewModel.startVM(null);
            };
        };
        masterViewModel.loginVM(new LoginVM());
        $(document).on('pageinit', function () {
            ko.applyBindings(masterViewModel);
        });

</script>

感谢您的回答

编辑： 我发现，如果我比较我的 masterViewModel.startVM()!= null 即使它必须相同，我也会得到不同的值！ 也许这对你有帮助！ 请查看我的代码中带有“**”的 cmets 以了解我的意思

Answer 1

尝试在就绪事件而不是 pageinit 事件中加载视图模型。

$(document).ready(function () {
    ko.applyBindings(masterViewModel);
});