0

我在绑定 JQuery 和 Knockout 时遇到问题!

我不知道我的问题在哪里!也许你们中的任何人都可以看看这个小提琴

这就是我尝试进入下一个 Knockout ViewModel 的方式:

  masterViewModel.loginVM(null);
  masterViewModel.startVM(new StartVM());

那是我的 MasterViewModel

 var masterViewModel = {

            loginVM: ko.observable(),
            startVM: ko.observable(),
        };

如果不使用 JQuery mobile(绑定到我的 ASP.NET MVC4 项目中)它工作正常

这是相同的小提琴,只是没有使用 jQuery:[fiddle] http://jsfiddle.net/B2A5f/

当我在 ASP.NET MVC4 中尝试此操作时,它无法正常工作!

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


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

            };
        };

        var StartVM = function () {
            self = this;
            //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>
4

1 回答 1

0

而不是绑定:

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

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

像这样,试试:

<form action="" data-bind="css: { hidden: startVM==null } ">

<form action="" data-bind="css: { hidden: loginVM ==null } "> 

当然隐藏在 CSS 中的是:

.hidden{ display:none; }

这是用淘汰赛展示一件事或另一件事的现状方式。

在看到你的第二把小提琴后,我检查了你使用的是什么版本的淘汰赛——它是 1.2.0。所以,我所做的是用 2.2.0 http://jsfiddle.net/2Ed98/2/升级你的小提琴,它按预期工作。Knockout 在版本 1 的兼容性方面存在问题。

于 2013-01-02T10:47:04.617 回答