Javascript 使用knockout.js更新jquery UI对话框的内容

我使用的是最新版本的knockout.js和jquery。我试图创建一个jquery对话框，每当某个特定的ko.observable有值时，该对话框就会打开和关闭。我的实现基于这个jsfiddle中的代码，我在这个Knockout.js论坛中找到了它

然而，这种方法只有在我包含现在不受欢迎的jquery-tmpl.js插件（版本1.0.0pre）时才有效。我将问题归结为两个jsfiddle，一个工作版本（），一个坏版本（）。唯一的区别是jquery-tmpl.js没有包含在第二个版本中

问题的根源在于对话框及其内容所依赖的可观察性在我第一次加载页面时没有设置。因此，模板绑定到的属性不可用，从而导致错误。在敲除之前包含jQueryTMPL可以解决问题，因此我假设敲除模板引擎在jQueryTMPL可用时会改变其行为。然而，我不想依赖一个不推荐使用的插件

是否有更好的方法将jquery UI对话框及其内容绑定到ViewModel？

只需更改以下内容：

<script id="newDialogTmpl" type="text/html">
    Add <span data-bind="text: displayName"></span>?
</script>
​

添加
​

为此：

<script id="newDialogTmpl" type="text/html">
    <!-- ko if: $data -->
    Add <span data-bind="text: displayName"></span>?
    <!-- /ko -->
</script>

添加

第一次，您的

newThing

prop等于

null

，因此它是触发器引用错误。您应该检查

$data

是否不为空，然后如果为空则渲染模板-不执行任何操作只需更改以下内容：

<script id="newDialogTmpl" type="text/html">
    Add <span data-bind="text: displayName"></span>?
</script>
​

添加
​

为此：

<script id="newDialogTmpl" type="text/html">
    <!-- ko if: $data -->
    Add <span data-bind="text: displayName"></span>?
    <!-- /ko -->
</script>

添加

---

第一次，您的

newThing

prop等于

null

，因此它是触发器引用错误。您应该检查

$data

是否为空，然后如果为空则呈现模板-什么都不做

您是否尝试过显式订阅可观察的更改，因此您将显示/隐藏对话框的代码放在“订阅”函数中？请参阅“明确订阅可观测数据”第节。我希望将DOM操作代码保留在自定义绑定中，因为这似乎是最佳实践。Serjio的答案正是我所缺少的。您是否尝试过显式订阅可观察的更改，所以将显示/隐藏对话框的代码放在“订阅”函数中？请参阅“明确订阅可观测数据”第节。我希望将DOM操作代码保留在自定义绑定中，因为这似乎是最佳实践。塞尔吉奥的回答正是我所缺少的。啊，就是这样！这么简单。您的解决方案在我的JSFIDLE中工作，更重要的是，它在我的实际代码中解决了这个问题。感谢您的快速响应！还有一个技巧是，实际上可以将“if”作为模板绑定的选项，例如：

template:{template:{name:'newDialogTmpl'，'if'：newThing，data:newThing}

，然后您可以将其从模板中删除。jQuery模板引擎比本机引擎更能容忍数据为空。我将

if

放在引号中，因为上次我检查旧IE版本时，不喜欢KO在该级别解析中的

if

关键字。@RPNiemeyer是模板绑定中的“if”选项任何地方都有文档记录？我没有在中看到它。我对敲除非常陌生。看起来我们没有。我会处理这个问题。现在，这篇文章我的帮助解释了它存在的原因：啊，就是这样！很简单。你的解决方案在我的JSFIDLE中工作，更重要的是它在我的实际代码中解决了这个问题。感谢你的快速响应！还有一个提示是你实际上可以将“if”作为模板绑定的选项，例如：

template:{template:{name:'newDialogTmpl'，if:'newThing，data:newThing}

，然后您可以将其从模板中删除。jQuery模板引擎比本机引擎更能容忍数据为空。我将

if

放在引号中，因为上次我检查旧IE版本时，不喜欢KO在该级别解析中的

if

关键字。@RPNiemeyer是模板绑定中的“if”选项任何地方都有文档记录？我没有在中看到它。我对击倒非常陌生。看起来我们没有。我会处理好的。现在，这篇文章我的帮助解释了它存在的原因：