javascript - 带有“a”标签的 Ember View 助手的意外行为

Question

{{#view tagName="a" href="#"}}
  The Link
{{/view}}

预期的 HTML

<a href="#" class="ember-view" id="emberXXX"> The Link </a>

现实

<a class="ember-view" id="emberXXX"> The Link </a>

看不到href属性

也试过hrefBinding="#", href=true

在类似的行中，我想将一个动作与之关联，所以尝试了以下失败尝试

{{#view tagName="a" href="#" snippet}}
  The Link
{{/view}}

片段在哪里action="showHome", click="showHome", actionBinding="showHome", clickBinding="showHome"（此处的操作用于路由转换）

他们都没有工作，我知道我可以简单地做到

<a href="#" {{action showHome}}>The Link</a>

或定义视图

aView = Ember.View.extend({
  tagName: 'a',
  click: function(){
    this.get('controller').controllers.send('showHome');
  }
})

让事情正常进行，但我很好奇如何以模板方式实现它

score 8 · Accepted Answer

简而言之（和解决方法）

{{#view Ember.Button tagName="a" target="#" action="someAction"}}Link Name{{/view}}

长篇回答：

当你说你可以简单地做

<a href="#" {{action showHome}}>The Link</a>

那是您获得href="#"某些预定义路由操作的唯一方法。但从 JavaScript 应用程序的角度来看，创建/扩展视图更有意义。

当您说您也尝试过时hrefBinding="#"，这意味着您了解绑定是针对该视图的。因此，从模板的角度来看，html不应该只支持（我认为）在标签中包含虚拟链接。正确的方法应该是扩展视图：

AnchorView = Ember.View.extend({
  tagName: 'a',
  attributeBindings: ['href'],
  href: '#' //
});

1 回答 1