data-binding - knockout.js/devExtreme 无法处理 css 绑定

Question

我有一个 dxTileView 模板，它数据绑定到来自服务器的数据。然后，在模板中我想添加一个css绑定，当点击磁贴时添加一个类......

<div data-bind="dxTileView: {itemClickAction:assignProject, dataSource:quickBooking}">
          <div data-options="dxTemplate : { name:'item' }" data-bind="css: {selectedTile: selectedTile}">
            <h4 data-bind="text: blah"></h4>
            <p data-bind="text: blah"></p>
          </div>
</div>

然后在视图模型中我有：

var viewModel = {
        selectedTile: ko.observable(false),
        blah: blah}

和错误信息：

Uncaught ReferenceError: Unable to process binding "css: function (){return {selectedTile:selectedTile} }"
Message: selectedTile is not defined 

我在绑定上尝试了一些变体，如下所示，但没有一个工作：

data-bind="css: {selectedTile: viewModel.selectedTile}"//error: viewModel not defined
data-bind="css: {selectedTile: viewModel.selectedTile()}"
data-bind="css: {selectedTile: true}" //this works,was just for testing
data-bind="css: {selectedTile: selectedTile(false)}"//etc etc etc

非常感谢您的帮助！

Answer 1

要访问视图模型的根目录，请使用$root.

尝试这个：

data-bind="css: {selectedTile: $root.selectedTile}"