3

私はKOとJSが初めてで、次のテストを行いました。のときにログインボタンを、のときvm.authenticated == falseにログアウトボタンを表示したいvm.authenticated == true。タイトルが適切に変更されているのでバインドは問題ないように見えますが、KOifが機能していないようです。観察可能にしようとしましauthenticatedたが、修正されました。どんな助けでも大歓迎です。

ありがとうございます。それでは、お元気で

HTMLコードは次のとおりです。

<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8"/>
    <title>Test</title>
</head>

<body>
    <script src="../Scripts/libs/jquery-1.9.0.js"></script>
    <script src="../Scripts/libs/knockout-2.2.1.debug.js"></script>

    <p data-bind="text: title"></p>
    <!-- ko if: authenticated == false -->
    <form>
        <input type="text" data-bind="value: userId"/>
        <input type="password" data-bind="value: password"/>
        <button type="button" data-bind="click: login">Login</button>
    </form>
    <!-- /ko -->
    <!-- ko if: authenticated == true -->
    <form>
        <input type="text" data-bind="value: userId"/>
        <button type="button" data-bind="click: logout">Logout</button>
    </form>
    <!-- /ko -->

    <script type="text/javascript">
        window.onload = function () {
            var vm = {userId: 'user', password: 'password', title: 'unsigned', authenticated: false, login: function () {
                    var vm1 = {
                        userId: 'user', password: 'password', title: 'unsigned1', authenticated: true, login: function () { }, logout: function () {
                            var vm2 = { userId: 'user', password: 'password', title: 'unsigned2', authenticated: false, login: function () { }, logout: function () { } };
                            ko.applyBindings(vm2); 
                        }
                    };
                    ko.applyBindings(vm1); 
                }, logout: function () { }
            };
            ko.applyBindings(vm); 
        };
    </script>    
</body>
</html>
4

2 に答える 2

1

これはあなたが達成しようとしていることですか？

var vm = {
    userId: 'user',
    password: 'password',
    title: ko.observable('unsigned'),
    authenticated: ko.observable(false),
    login: function () {
        vm.userId = 'user';
        vm.password = 'password';
        vm.title('unsigned1');
        vm.authenticated(true);
    },
    logout: function () {
        vm.userId = 'user';
        vm.password = 'password';
        vm.title('unsigned2');
        vm.authenticated(false)
    }
};

ko.applyBindings(vm);

また、バインディングの定義方法について ben336 が述べたことにも注意してください。

于 2013-01-24T20:46:58.850 に答える
0 
<!-- ko if: authenticated == true -->

する必要があります

<!-- ko if: authenticated -->

if 式は、式ではなく、変数の真偽を検証します。

ドキュメントを見る

のために

<!-- ko if: authenticated == false -->

あなたが使用することができます

<!-- ko ifnot: authenticated  -->

アップデート

私はあなたのトリプルバインディングにすぐには気づきませんでした。バインドする単一のモデル オブジェクトを登録する必要があります。プロパティを更新に応答させたい場合は、それをオブザーバブルにすることができます。

于 2013-01-24T20:09:49.330 に答える