Ember.js 使用Ember cli扩展{{link to}}

这个问题与未回答的问题类似

我试图扩展

{{{link to}}

帮助程序以输出额外的属性绑定。但是，这些属性不会出现在我们的HTML中。我们的情况如下：

//views/link-to.js (normally coffeescript)
import Ember from 'ember'

var LinkToView = Ember.LinkView.reopen({
  attributeBindings: ['data-toggle', 'data-placement', 'title']
});

export default LinkToView;

渲染输出如下所示：

define('app/views/link-to', ['exports', 'ember'], function (exports, Ember) {

  'use strict';

  var LinkToView;

  LinkToView = Ember['default'].LinkView.reopen({
    attributeBindings: ['data-toggle', 'data-placement', 'title']
  });

  exports['default'] = LinkToView;

});

当调用它和它的渲染输出时：

// Any .hbs file
{{#link-to 'account' 
    class='header-link' 
    data-toggle='tooltip' 
    data-placement='right' 
    title='Account'
}}
    <span class="glyphicon glyphicon-cog" aria-hidden="true"></span>
{/link-to}}

// Rendered...
<a id="ember615" class="ember-view header-link" href="/account"     title="Account">             
    <span class="glyphicon glyphicon-cog" aria-hidden="true"></span>
</a>

//任何.hbs文件
{{#链接到“帐户”
class='header-link'
数据切换=“工具提示”
数据放置class='right'
标题：账户
}}
{/链接到}
//渲染。。。

我们哪里出了问题？我知道这和解析器或者我们如何称呼它有关

---

谢谢。

所以这可能不是最正确的答案，但我意外地发现，如果您在

route/applaction.js

的

beforemodel

钩子中添加任何类型的扩展或覆盖，它会完美地工作：

// routes/application.js
export default Ember.Route.extend({
  beforeModel: function() {
    Ember.LinkView.reopen({
      attributeBindings: ['data-toggle', 'data-placement', 'title']
    });
  })
});

---

因此，这可能不是最正确的答案，但我意外地发现，如果您在

route/applaction.js

的

beforemodel

hook中添加任何类型的扩展或重写，它就会完美地工作：

// routes/application.js
export default Ember.Route.extend({
  beforeModel: function() {
    Ember.LinkView.reopen({
      attributeBindings: ['data-toggle', 'data-placement', 'title']
    });
  })
});

余烬2.0版+

创建目录应用程序/重新打开

创建文件app/reboos/link-component.js

import Ember from 'ember'; 
Ember.LinkComponent.reopen({
  attributeBindings: ['data-variation', 'data-offset', 'data-content','data-any']
});

在app.js中导入它

import LinkComponent from./重新打开/LinkComponent'

就这些。对于ember cli<2.0，将LinkComponent替换为LinkView

，对于ember 2.0+

创建目录应用程序/重新打开

创建文件app/reboos/link-component.js

import Ember from 'ember'; 
Ember.LinkComponent.reopen({
  attributeBindings: ['data-variation', 'data-offset', 'data-content','data-any']
});

在app.js中导入它

import LinkComponent from./重新打开/LinkComponent'

---

就这些。对于ember cli<2.0，将LinkComponent替换为LinkView

文件：

app/reopens/link component.js

如果这可以帮助其他人获得通用数据-*用于Ember 2.x

import Ember from 'ember';

Ember.LinkComponent.reopen({
    init: function() {
        this._super();
        var self = this;

        // bind attributes beginning with 'data-'
        Object.keys(this).forEach(function(key) {
            if (key.substr(0, 5) === 'data-') {
                self.get('attributeBindings').pushObject(key);
            }
        });
    },
});

---

文件：

app/重新打开/link-component.js

如果这可以帮助其他人获得通用数据-*用于Ember 2.x

import Ember from 'ember';

Ember.LinkComponent.reopen({
    init: function() {
        this._super();
        var self = this;

        // bind attributes beginning with 'data-'
        Object.keys(this).forEach(function(key) {
            if (key.substr(0, 5) === 'data-') {
                self.get('attributeBindings').pushObject(key);
            }
        });
    },
});

---

不确定是否可以，但可以做的是为此创建一个帮助器和/或组件。如果你对这种方法感兴趣，让我知道我会写一个答案。是的，我想看看。谢谢我无意中发现了这个对你有用吗？不太好。这主要是我已经在做的事情。不过，我认为问题与Ember CLI解决问题的方式有关。不确定您是否可以，但您可以为此创建一个帮助器和/或组件。如果你对这种方法感兴趣，让我知道我会写一个答案。是的，我想看看。谢谢我无意中发现了这个对你有用吗？不太好。这主要是我已经在做的事情。不过，我认为这个问题与Ember CLI如何解决有关。这很好，您能告诉我如何更改href，例如，当单击任何链接时，我想执行一些JS（打开选项卡）。谢谢！这太好了，你能告诉我如何更改href吗？例如，当点击任何链接时，我想执行一些JS（打开一个选项卡）。谢谢！这不再适用于Ember>=2.8，因为attributeBindings是

对象。seal

ed。这不再适用于Ember>=2.8，因为attributeBindings是

对象。seal

ed。从技术上讲，您不需要在路由的业务逻辑中执行此操作，事实上，我认为这会让它更混乱，因为你没有用模型做任何事情（我是学究）。从技术上来说，你不需要在路线的业务逻辑中做这件事，事实上我认为这会让它更混乱，因为你没有用模型做任何事情（我是学究）。