谁能解释我在 this example jsfiddle 中的 View 模型或模板有什么问题? ?
它没有按预期工作。基本上, View 模型包含一个对象,该对象是 null
.在 View 中,有一个模板绑定(bind)到这个对象。由于此对象为空,因此不应呈现模板。但是,它确实尝试呈现模板并在我的示例中失败。如果作业对象为空,那么我不想渲染模板。
根据this article by Ryan ,如果一个 View 模型包含一个空对象并且这个对象有一个“template
绑定(bind)”,它不会渲染模板。
这是我的 View 模型:
var job = function(title) {
this.jobTitle = ko.observable(title);
}
var ViewModel = function(first, last) {
this.firstName = ko.observable(first);
this.lastName = ko.observable(last);
//this.job = ko.observable(new job("software developer"));
this.job = ko.observable(null);
this.fullName = ko.computed(function() {
return this.firstName() + " " + this.lastName();
}, this);
};
ko.applyBindings(new ViewModel("FirstName", "LastName"));
这是观点:
<div class='liveExample'>
<p>First name: <input data-bind='value: firstName' /></p>
<p>Last name: <input data-bind='value: lastName' /></p>
<p data-bind="template: { name: 'editorTmpl', data: job }"></p>
<h2>Hello, <span data-bind='text: fullName'> </span>!</h2>
</div>
<script id="editorTmpl" type="text/html">
Job: <input data-bind='value: jobTitle' />
</script>
最佳答案
linked artifice差不多3年前写的。到 Knockout 的最新版本大约是 1.2.1 时。
在 Knockout 1.2.1 中,您的代码运行良好:Demo using KO 1.2.1
但是从那时起,Knockout 发生了很大变化,因此不再支持这种行为。
现在你需要使用 if
option of the template捆绑
<p data-bind="template: { name: 'editorTmpl', if: job, data: job}"></p>
演示 JSFiddle .
或
with
( if
) 绑定(bind)以实现相同的结果:<div class='liveExample'>
<p>First name: <input data-bind='value: firstName' /></p>
<p>Last name: <input data-bind='value: lastName' /></p>
<!-- ko with: job -->
<p data-bind="template: { name: 'editorTmpl'}"></p>
<!-- /ko -->
<h2>Hello, <span data-bind='text: fullName'> </span>!</h2>
</div>
演示 JSFiddle .
关于knockout.js - 当源为空/未定义时模板绑定(bind)不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23720373/