Question

一切！我有以下HTML：

  <table>
        <thead>
            <tr>
                <th>Simple app</th>
            </tr>
        </thead>
        <tbody data-bind="foreach: tests">
            <tr>
                <td data-bind="text: testName"></td>
                <td data-bind="text: result"></td>
                <td><button data-bind="click: runTest, style: {backgroundColor: color}">Run test</button></td>
            </tr>
        </tbody>
    </table>

以及以下js：

function Test(testName, test) {
    var vm = {};

    vm.result = ko.observable(false);
    vm.testName = testName;
    vm.color = ko.computed(function (){
        return vm.result === true ? 'green' : 'red';
    }, vm);

    vm.test = test;
    vm.runTest = function () {
        var result = vm.test();
        vm.result(result);
    }

    return vm;
}

function TestsViewModel(modelName, tests) {
    var vm = {};

    vm.modelName = modelName;
    vm.tests = [];

    for(var i = 0; i < tests.length; i++){
        vm.tests.push(Test(tests[i].title, tests[i].test));
    }

    return vm;
}

function test1() {
    return true;
}

function test2(){
    return false;
}

function test3(){
    return void (0) === undefined;
}

ko.applyBindings(TestsViewModel('Name', [{
    title: 'Test1',
    test: test1
}, {
    title: 'Test2',
    test: test2
}, {
    title: 'Test3',
    test: test3
}]));

我想根据结果属性的值更改按钮的颜色。但是当结果改变时，淘汰赛不会检查值。有什么问题？

Answer 1

你错过了括号：

vm.color = ko.computed(function (){
    return vm.result() === true ? 'green' : 'red'; // vm.result()
}, vm);

Answer 2

你计算的＆＃34;颜色＆＃34;你必须将结果用作一个可观察的，而不仅仅是一个属性。 vm.result * （） *不是vm.result。

vm.color = ko.computed(function (){
        return vm.result() === true ? 'green' : 'red';
    }, vm);

Knockout没有可观察的样式属性

2 个答案: