Javascript 基于可观察到的数据更改类

我的viewmodel中有一个名为“旋转”的字段。如果为0，图像将保持在0度（北）。如果是1度，90度等等

obeservable在我预期的时间内（单击按钮时）正在更改，但样式没有更新

self.RotateLeft = function (data) {

    this.Rotation(this.Rotation + 1);
    if (this.Rotation() == 4)
        this.Rotation(0);
  //  alert(data.Rotation());

}

我的形象定义如下：

<img data-bind="attr: {src: Image}, css: {north: Rotation()==0, east: Rotation()==1, south: Rotation()==2, west: Rotation()==3}" alt="text: Description" class="img-responsive">

---

这是更改css类的正确方法吗？如果是这样的话，知道它为什么不旋转吗？

在javascript中发现错误

this.Rotation + 1

应该是

this.Rotation() + 1

---

新手错误。

很高兴你能成功。但是考虑到所有的类都是互斥的，您可能应该绑定到一个可观察的对象，其中包含您想要直接应用的类。这将大大简化一切

var viewModel={
内容：ko.可观察（‘foobar’），
css:ko.observable（），
C选项：[“红色”、“绿色”、“蓝色”]，
下一步：函数（）{
var css=viewModel.css（），
cssOptions=viewModel.cssOptions，
长度=cssOptions.length，
索引=cssOptions.indexOf（css），
nextIndex=索引>=0？索引+1:0；
css（cssOptions[nextIndex%length]）；
}
};
applyBindings（viewModel，document.getElementById（'main'）
.red{color:red；}
.green{颜色：绿色；}
.blue{color:blue；}

下一个
我觉得这很好。如何绑定
RotateLeft（）
函数？在我看来，您可能会遇到问题，因为您正在使用
此
，但未绑定到
此
。p、 在美国，您不必为css绑定使用对象，特别是因为您想要的类都是互斥的，您可以使用一个observate来返回您想要应用的类名。谢谢@JeffMercado-发现了我的问题。请参阅javascript。行“this.Rotation+1”。我忘了括号！：）它将1添加到一个函数中。把它改成这个。旋转（）+1解决了这个问题。啊，也错过了那个！很高兴它起作用了。
this.Rotation() + 1