Question

所以这就是我要做的事情

使用敲除我希望有一些只在变量myvalue有一些内容时出现

这是我的代码

HTML

<script type='text/javascript' src="../js/knockout-2.3.0.js" defer="defer"></script>
<script type="text/javascript" src="../js/searchModel.js" defer="defer" ></script>

<h2>Welcome to My World :D</h2>

<div data-bind="visible: myValues().length > 0">
    You will see this message only when 'myValues' has at least one member.
</div>

JS

function helloModel() {
// Editable data
this.viewModel = {
    myValues: ko.observableArray([]) // Initially empty, so message hidden
   };
  //viewModel.myValues.push("some value"); // Now visible
}

我总是得到的错误是：

Uncaught ReferenceError: Unable to parse bindings.
Bindings value: visible: myValues().length > 0
Message: myValues is not defined

很可能是因为我添加到脚本标记的属性延迟，这意味着在我渲染整个html元素之前不会加载该文件

然而，这很重要，我将在以下三种情况中解释：

1-推迟知道搜索模型如下所示

现在，在重新呈现HTML元素之前，将包含搜索模型。但是这会导致问题，因为它使用了knokout代码

Uncaught ReferenceError: ko is not defined

2 - 推迟搜索模型不知道

<script type='text/javascript' src="../js/knockout-2.3.0.js" defer="defer"></script>
<script type="text/javascript" src="../js/searchModel.js" ></script>

会导致同样的老问题

Uncaught ReferenceError: Unable to parse bindings.
Bindings value: visible: myValues().length > 0
Message: myValues is not defined

3-忘记推迟

<script type='text/javascript' src="../js/knockout-2.3.0.js" ></script>
<script type="text/javascript" src="../js/searchModel.js" ></script>

也会引起跟随问题未捕获的TypeError：无法读取null的属性'nodeType'

因为脚本会在html上加载并尝试在元素创建之前绑定它

那么您建议如何解决该问题：）

Answer 1

这应该与您发布的代码一起使用。

<h2>Welcome to My World :D</h2>

<div data-bind="visible: myValues().length > 0">
    You will see this message only when 'myValues' has at least one member.
</div>

<script type='text/javascript'>
  ko.applyBindings((new helloModel()).viewModel)
</script>

我建议您将viewmodel重构为这样

function helloModel() {
    var self = this;
    self.myValues = ko.observableArray([]);
    self.pushHello = function(data,e) {
       self.myValues.push("Hello, world!");
    };
    //self.myValues.push("some value"); // Now visible
}

然后在初始化代码中

<script type='text/javascript'>
  ko.applyBindings(new helloModel())
</script>

Answer 2

你有几个选择 -

如评论中所述，您可以使用with绑定，但在这种情况下，foreach更典型。

做你想做的最简单的方法之一就是在你的myValues observableArray为空时有一个替代方法 -

<!-- ko if: !myValues().length -->
    <span>There is no data yet</span>
<!-- /ko -->
<!-- ko if: myValues().length -->
    <p>The length of myValues is - <span data-bind="text: myValues().length"></span></p>
<!-- /ko -->

http://jsfiddle.net/eVcDR/

当然，如果您删除第一个无容器绑定，它将具有与您要查找的效果相同的效果，则不会验证该数组是否为空。

未捕获的ReferenceError：无法解析绑定

2 个答案: