javascript - Knockout.js 如何从绑定(bind)构建字符串

Question

我正在使用 knockout 绑定(bind)创建链接列表:

Javascript 和 View 模型如下所示:

$(function () {
   var adminViewModel = function()
   {
       var self = this;
       self.leftItems = ko.observable([ { Name: "Item1", Id: 0 }]);
       self.getChildren = function (id, list) {
           var url ="@Url.Content("~/api/Test/GetChildren/")" + id;
           $.getJSON(url, function (data) {
              list(data);
           });
        };
    }
    var Admin3App = window.Admin3App = window.Admin3App || {};

    Admin3App.viewModel = new adminViewModel();
    ko.applyBindings(Admin3App.viewModel);

    function getLeftChildren(id)
    {
        Admin3App.viewModel.getChildren(id, Admin3App.viewModel.leftItems);
    }
    getLeftChildren(0);

}

(编辑:ko.observable 的 init 缺少 Id(即使这没有导致错误，但添加了它)

其工作原理是 View 模型将加载一堆没有父项(id 0)的项目。 为了简单起见，我只包含左侧版本。但该页面的左侧和右侧都有一个项目列表，因此每个项目都有一个功能。

填充左侧项目以查看模型左侧项目并显示如下。但每个项目都是一个链接，一旦通过 javascript 单击，就会根据父 ID 刷新项目。 (很像在资源管理器中浏览文件夹查看器)。

但我不知道如何在 knockout 中声明绑定(bind)来构建 URL。我知道这可能非常简单，但我只是想念它。

这是我尝试过的 html

<div class="leftView">
    <div data-bind="foreach: leftItems">
        <a data-bind="text: Name, attr : { href:'javascript:getLeftChildren(' + Id + ')' }"></a><br />
    </div>
</div>

(编辑:错过了一个单引号，但还是遇到了相同的错误) 但我不断收到绑定(bind)错误

Answer 1

有几件事:

1) leftItems 理想情况下应该是一个 observableArray

2) 您插入 leftItems 的初始对象没有 Id 属性

这是一个 JSfiddle，它纠正了一些问题并演示了加载初始数据集，然后再次调用以加载不同的数据。我还将外部 JavaScript 调用移至 viewModel 内部，并切换为使用单击处理程序来传递刷新数据(请注意，单击绑定(bind)会自动将数据项作为第一个参数发送到事件处理程序中，因此您可以访问创建 URL 所需的 ID)。

http://jsfiddle.net/jearles/xTHFg/