0

编辑：-我已经在github上传了项目的完整代码。

以下是我的视图模型：

define(["ko",
        "service/dataService",
    'service/logger',
        'durandal/system'],
function (ko, svc, logger, system) {
    var that = this,
    results = ko.observableArray(),
    query = ko.observable();

    var SearchProduct = {
        activate: activate,
        title: 'Search',
        search: search,
        results: results,
        query: query
    };

    return SearchProduct;

    function activate() {}

    function search() {
        svc.searchProduct(query()).then(function (data) {
            results([]);results(data);
        }).fail(function (jqXHR, textStatus) {
            var msg = 'Error searching item: ' + textStatus;
            logger.logError(msg, jqXHR, system.getModuleId(svc), true);
        });;
    }
});
  1. 首先是在search函数中，当我调用时query()，它返回未定义。

  2. results其次，当我使用以下行搜索并添加新项目时：

    results(data);//数据是 10 项的数组

更改未反映在以下 html 模板中：

<form class="navbar-form pull-right" role="search" data-bind="submit: search">
    <div class="form-group">
            <input type="text" class="form-control" placeholder="Search" 
                    data-bind='text: query, valueUpdate: "afterkeydown"'>
    </div>
    <button type="submit" class="btn btn-default">
        <span class="glyphicon glyphicon-search"></span>&nbsp;Search
    </button>
</form>

<section data-bind="foreach: results">
    <div class="row">
        <div class="col-md-4 pull-left">
            <label data-bind="text: name"></label><br/>
            <label data-bind="text:category"></label>
        </div>
        <div class="col-md-7 pull-right">
            <label data-bind="text:shortDescription"></label>
        </div>
    </div>
</section>

section使用foreach: results. _ 当应用更改后（添加到 observable 的项目列表）并且我在从其他页面导航后进入页面时，以下行正确反映了计数：

<span data-bind="text: results().length"></span>&nbsp;items found

我究竟做错了什么？

编辑：- 难题的一部分已解决

如果我使用results()而不是results，与列表的绑定有效！！！

<section data-bind="foreach: results()">

编辑 3：- *创建了简单的cshtml视图并在那里使用了 viewmodel 的ko.applyBindings方法。它以这种方式工作。似乎我缺少一些drundal接线*

4

2 回答 2

1

您当前的代码有多个问题：

  • Durandal 2.0.0 现在通过 requrejs 使用 Knockout。（文档到处都在更新。请参阅示例作为参考）因此无需显式引用 Knockout，因为它可能会导致像您这样的奇怪错误。Durandal 使用 ko 来命名knockoutout。所以改变你的main.js：

    requirejs.config({
    paths: {
     //...      
     'knockout': "../Scripts/knockout-2.3.0",  
});

    并删除该行：define('knockout', [], function () { return ko; });

  • 您的this处理在您的视图模型中包含一些错误，因此您在全局窗口对象上创建了属性，而不是将它们声明为私有字段。因此，that您不需要使用var：

    var results = ko.observableArray([]);
var query = ko.observable('');

    在您的搜索方法中，您可以在没有任何“前缀”的情况下引用它们：

    return dataService.searchProduct(query()).then(function (data) {
   results([]);
   results(data);
})

我已经向您发送了一个拉取请求。

于 2013-10-22T07:34:34.660 回答
0

您的变量声明部分的语法无效。将其更改为：

var that = this, // coma needed
results = ko.observableArray(), // coma needed
query = ko.observable();

如果您不对未定义变量使用 var 关键字，它将成为全局变量，并且在严格模式下会出错。

希望这可以解决您的问题。

于 2013-10-17T14:24:28.900 回答