css 绑定中的自定义 class 名称

Question

我有一个这样的可观察数组：

arrayName =  ko.observableArray([
    {name: First Name, type: normal},
    {name: Second Name, type: low},
    {name: Third Name, type: high}]);

并想像这样设置我的 DOM 元素的 class：

<div data-bind="foreach: arrayName">
    <div data-bind="text: name"> </div>
    <div data-bind="css: type"> </div>
</div>

有人知道如何让它成为可能吗？

Answer 1

您的示例有效，只需要为每个属性:

的字符串添加引号

<div data-bind="foreach: arrayName">
    <div data-bind="text: name"> </div>
    <div data-bind="css: type"> </div>
</div>

<script>
    function vm (){
      this.arrayName =  ko.observableArray([
        {name: "First Name", type: "normal"},
        {name: "Second Name", type: "low"},
        {name: "Third Name", type: "high" }]);         
    }
    ko.applyBindings(new vm());
</script>

Answer 2

尝试使用这个：

Example in JSFiddle

HTML:

<div data-bind="foreach: arrayName">
<div data-bind="text: name, css: type"> </div>
</div>

脚本：

var myModel = function() {

   this.arrayName =  ko.observableArray([
     {name: "First Name", type: "normal"},
     {name: "Second Name", type: "low"},
     {name: "Third Name", type: "high"}]);


}




ko.applyBindings(new myModel());

首先，classes 的所有值都应以字符串表示形式定义。

您将 class（在您的示例中）添加到空的 div，它没有任何内容，您也看不到它，如果我理解正确，您应该添加class 到您添加名称属性的同一个 div。

HTH。

css 绑定中的自定义 class 名称

Custom class name in css binding

javascript

css

knockout.js