KnockoutJS找到ko.observable（）长度

Question

编辑为什么计算出的长度不会保存？

有没有办法对一个observable进行数据绑定，只要它的精度为1,2或3？下面是我的VM：

function FFS_ViewModel() {
    var self = this;
    .....
    self.SortOrder = ko.observable();
    self.SortOrderLen = ko.computed(function(){
          return self.SortOrder().length; // **Error Here: Cannot read property 'length' of undefined**
    });
    self.Description = ko.observable();
    self.records = ko.observableArray([]);
})

以下是视图：

<table class='TFtable'>
   <thead>
       <tr>
         <th>Sort Order</th>
       </tr>
   </thead>
   <tbody data-bind="foreach: records">
       <tr id="mainFactors">
            <td data-bind="if: SortOrderLen === 2"></td>
            <td data-bind="text: Description"></td>
       </tr>
   </tbody>
</table>

Answer 1

问题1：

在没有参数的情况下初始化observable时，其值变为undefined：

self.SortOrder = ko.observable();
console.log(self.SortOrder()); // Prints: undefined

尝试访问undefined的属性时，会引发错误：

(undefined).length; // Throws: Cannot read property 'length' of undefined

修复1：

确保您的计算值可以处理undefined值：

self.SortOrderLen = ko.computed(function() {
  if (!self.SortOrder()) return 0;

  return self.SortOrder().length;
});

或确保使用有效值初始化SortOrder：

self.SortOrder = ko.observable([]);

问题2：

当您想要使用computed或其他observable的值时，您需要调用它（它是一个函数）。

self.SortOrder;    // Returns the `computed` instance
self.SortOrder();  // Returns the actual value inside

因此，此绑定不会工作：

// never `true`, since a ko.computed !== 2
data-bind="if: SortOrderLen === 2" 

修复2：

打开绑定中的值：

data-bind="if: SortOrderLen() === 2"

Answer 2

您可以使用可见绑定：

data-bind="visible: shouldShow"

或者您可以在评论中执行if逻辑

<!-- ko if: someExpressionGoesHere -->
   <td>show element</td>
<!-- /ko -->