Knockoutjs没有更新我的UI时，我改变observableArray

Question

这是我的模板：

<tr> 
    <td> 
     <table> 
      <thead> 
       <th> 
        <span>Option name:</span> 
       </th> 
      </thead> 
      <tbody data-bind="template: {name: 'optionChoiceTemplate', foreach: choices, templateOptions:{choiceArray: choices} }"></tbody> 
     </table> 
     <button data-bind="click: function(){choices.push('');}">Add new</button> 
    </td> 
</tr> 

但是，当我点击“新增”按钮，我的观点不更新，以包括与新选项空的字符串。我已经检查过调试器，将空字符串添加到选项中，并且我确定选择是observableArray，还有什么可能会出错？

Answer 1

的问题是，使用jQuery插件模板与template与foreach选项绑定时，空字符串被视为空值，而不是渲染。

您可以通过使用对象{text: ''}并绑定到text或通过推送除空字符串以外的内容（如单个空格）来解决此问题。

或者，如果您能够移动到Knockout 2.0并使用本机模板，那么您的空字符串项目将被正确渲染。

Answer 2

我创建了一个使用HTML显示项目列表的小提琴，并允许用户以两种方式添加新项目。第一种方法是使用您创建的点击功能。第二种方法是使用点击绑定。

这应该回答你的问题。

http://jsfiddle.net/johnpapa/4PfUr/