集淘汰赛CSS结合基础上可观察到的数组项

Question

每当我救我的项目我重新映射模型执行以下操作：

ko.mapping.fromJS(data, {}, deal); 

我的模型看起来像：

{ 
    "DealId": 0, 
    "BrokenRules": [ 
    { 
     "Property": "EndDate", 
     "Description": "End Date is required." 
    }, 
    { 
     "Property": "CustomerId", 
     "Description": "Customer is required." 
    }, 
    { 
     "Property": "LiveState", 
     "Description": "Live State is required." 
    }, 
    { 
     "Property": "WorkState", 
     "Description": "Work State is required." 
    } 
} 

我想设置css课div基于BrokenRules阵列的内容，并希望我能做类似的事情：

<div class="control-group" data-bind="css: { error: BrokenRules.filterByProperty('Property', 'EndDate').length !== 0 }"> 
     <label class="control-label">End Date</label> 
     <div class="controls"> 
      <input type="text" class="span2" name="EndDate" data-bind="value: EndDate, enable: $index() === 0" /> 
     </div> 
    </div> 

但这似乎并不奏效。我的filterByProperty在第一次发射时没有任何物品，并且由于某种原因，从不再发射。

ko.observableArray.fn.filterByProperty = function (propName, matchValue) { 
    return ko.computed(function() { 
     var allItems = this(), matchingItems = []; 
     for (var i = 0; i < allItems.length; i++) { 
      var current = allItems[i]; 
      if (ko.utils.unwrapObservable(current[propName]) === matchValue) 
       matchingItems.push(current); 
     } 
     return matchingItems; 
    }, this); 
} 

filterByProperty是从knockoutjs网站取得的。

这样做的任何帮助将不胜感激！谢谢！

Answer 1

filterByProperty函数返回ko.computed。为了获得实际的数组，您需要执行计算以获取底层JavaScript数组，然后您可以检查长度。

注意额外的括号后filterByProperty()

<div class="control-group" data-bind="css: { error: BrokenRules.filterByProperty('Property', 'EndDate')().length !== 0 }"> 

See the Fiddle