为锚标签绑定href属性

Question

我正在尝试将锚点属性绑定到KnockoutJS ViewModel字段。我尝试了这样的代码：

<a data-bind="href: Link, value: Title"></a>

但这并不起作用。我在哪里可以获得HTML元素可能的data-bind值列表？

- xwrs

Answer 1

你需要使用attr 绑定，这允许你设置任何你想要的属性。

例如：

<a data-bind="attr: { href: Link, title: Title }, text: Title">xxx</a>

- Richard Friend

Answer 2

这里您可以找到所有可能的绑定列表。

http://knockoutjs.com/documentation/value-binding.html

在左侧边栏中，您会找到其他绑定（如text、attr、style等）的链接。

您可以这样做：

attr: { href: 链接}, text: 标题 像xwrs评论的那样

或者创建一个模板http://knockoutjs.com/documentation/template-binding.html

希望能帮到您。

- dknaack

---

感谢。找到解决方案 <a data-bind="attr: { href: Link}, text: Title"> </a>。 - xwrs

Answer 3

作为@RichardFriend's answer的一种替代方案（也是更常用的选项），你可以编写自定义绑定处理程序，使你的视图更加简洁：

ko.bindingHandlers['href'] = {
  update: function(element, valueAccessor) {
    element.href = ko.utils.unwrapObservable(valueAccessor());
  }
};

ko.applyBindings({
  myUrl: 'http://stackoverflow.com',
  myText: 'Stack Overflow website'
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script>

<a data-bind="href: myUrl, text: myText"></a>

- Jeroen

Answer 4

这对我来说完美无缺

            <td class="CommandArea" rowspan="2">
            <p><a href='#' data-bind="click: abandon" >Abandon</a></p>
            </td>

- MarlinG

---

你能否编辑你的回答并解释它如何回答这个问题？ - soundslikeodd