在MVC ActionLink中使用Knockout绑定

Question

我正在尝试利用KnockoutJS和MVC 4来显示表格ActionLink第一列中包含定义的表格.显示数据本身非常简单,我在那里没有任何问题.我遇到的问题是生成ActionLink的.

我在jquery.tmpl模板中看了一下Use MVC helper,但是那里的解决方案没有使用knockout模板并且将Url插入到模型对象中是不可行的(用于创建视图模型的app域模型对象将被使用)广泛地通过申请).

表定义:

<table>
    <tbody data-bind="template: { name: 'dmuTableDetail', foreach: tables() }"></tbody>
</table>

(tables是一个可观察的数组,因此是parens).

淘汰赛模板定义:

<script id="dmuTableDetail" type="text/html">
    <tr>
        <td>@Html.ActionLink("Details", "Details", "DMUTableCategory", new { @Id = ??? } )</td>
        <td data-bind="text:TableId"></td>
        <td data-bind="text:TableName"></td>
    </tr>
</script>?

视图模型定义:

var PageViewModel = function () {
    self = this;

    self.tables = ko.observableArray([]);

    self.readItems = function () {
        self.tables(jQuery.parseJSON('[{"TableId":1001, "TableName":"Table#1"},{"TableId":1002, "TableName":"Table#2"}]'));
    }
}

$(document).ready(function () {
    vm = new PageViewModel();
    self.readItems('');
    ko.applyBindings(vm);
});

(实际代码执行Ajax调用来检索数据,但上面的代码也演示了这个问题).

无论我替换了什么???,我都无法获得TableId要插入href 的字段的值.

任何帮助将不胜感激.

谢谢.

Answer 1

谢谢Eric,你让我想到了一个锚元素并绑定了href属性.

似乎答案比预期的要容易一些(通常是!).

表定义:(与原始问题相同)

<table>
    <tbody data-bind="template: { name: 'dmuTableDetail', foreach: tables() }"></tbody>
</table>

淘汰模板定义:( 更改为href属性的绑定).

<script id="dmuTableDetail" type="text/html">
    <tr>
        <td><a data-bind="attr: { 'href': '@Url.Action("Details", new RouteValueDictionary() { { "Controller", "DMUTableCategory" } } )/' + TableId }">Details</a></td>
        <td data-bind="text:TableId"></td>
        <td data-bind="text:TableName"></td>
    </tr>
</script>?

视图模型定义:(与原始问题相同)

var PageViewModel = function () {
    self = this;

    self.tables = ko.observableArray([]);

    self.readItems = function () {
        self.tables(jQuery.parseJSON('[{"TableId":1001, "TableName":"Table#1"},{"TableId":1002, "TableName":"Table#2"}]'));
    }
}

$(document).ready(function () {
    vm = new PageViewModel();
    self.readItems('');
    ko.applyBindings(vm);
});

你真的不需要,RootValueDictionary但我已经包含它,所以人们可以看到如何更改请求发送到的控制器.