剔除中的数据绑定不适用于多个属性

时间:2018-10-15 07:38:08

标签: knockout.js knockout-validation knockout-3.0

我有一个下面的带有数据绑定的div标签

出现以下错误

绑定值:visible:showBannerMessage,样式:{backgroundColor:#ffeea8;高度:40px} 消息:无效或意外的令牌

我在哪里犯错? 谢谢

1 个答案:

答案 0 :(得分:1)

您传递给style绑定的值应该是有效的javascript对象,而不是css字符串。您犯了两个错误:

  • property: value对应该用,而不是;
  • 分隔
  • 字符串值应用引号引起来。 40px#ffeea8都应包装在''中。

即正确的绑定是:

/*              comma -------------v                */
style: { backgroundColor: '#ffeea8', height: '40px'  }
/*            quotes -----^-------^----------^----^ */

这是您的错误视图的复制品,显示了您描述的错误,而正确的视图包含了对这两个更改的修复:

// Wrong view
try {
  ko.applyBindings({
    showBannerMessage: true
  }, document.getElementById("wrong"));
} catch(err) {
  console.log("error:", err.message);
}

// Right view:
ko.applyBindings({
  showBannerMessage: true
}, document.getElementById("right"));
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.2/knockout-min.js"></script>

<!-- with errors -->
<div id="wrong" data-bind="visible:showBannerMessage, style:{backgroundColor: #ffeea8; height: 40px}">Hello world</div>

<!-- without errors -->
<div id="right" data-bind="visible:showBannerMessage, style:{ backgroundColor: '#ffeea8', height: '40px' }">Hello world</div>