Question

我正在尝试创建一个自定义帮助程序，它执行与链接相同的操作，除了一些更多的假设。

我正在努力做到这一点：

{{#my-link-to widget.href}}{{widget.title}}{{/my-link-to}}

它只接受路由参数（widget.href），并且路由被假定为“root”。这就是我实现它的方式：

Ember.Handlebars.registerHelper('my-link-to', function() {
  var args = [].slice.call(arguments);
  args.unshift('root'); // always use the 'root' route

  return Ember.Handlebars.helpers['link-to'].apply(this, args);
});

但是，我的结果链接全部指向/#，我收到This link-to is in an inactive loading state because at least one of its parameters presently has a null/undefined value, or the provided route name is invalid.错误。

执行{{#my-link-to 'root' widget.href}}{{widget.title}}{{/my-link-to}}并删除args.unshift('root')按预期工作。

我有一个小提琴在这里展示：http://jsfiddle.net/p2R9y/3/

我是Ember.js的新手，所以如果我做了一些明显的错误，请告诉我。

Answer 1

传递给Handlebars视图助手的每个参数都有一些额外的信息。所以args.unshift('root');还不够，你需要说出什么＆＃34; root＆＃34;表示：绑定字符串文字等。在您的情况下是字符串文字，因为预期用法是：

{{#my-link-to-works 'root' widget.href}}

您需要在选项哈希STRING密钥

中使用types

Ember.Handlebars.registerHelper('my-link-to-fails', function() {
  var args = [].slice.call(arguments),
      options = args[args.length-1]; // last argument is always the options hash

  args.unshift('root');
  // the types says what is the type of each argument, in that case we need STRING
  options.types.unshift('STRING');

  return Ember.Handlebars.helpers['link-to'].apply(this, args);
});

我使用此代码更新了您的小提琴请查看http://jsfiddle.net/marciojunior/sR96j/

Answer 2

我认为你想出了问题。

<强> 1。你的例子混淆了

您正在向'root'帮助者添加my-link-to-works：

{{#my-link-to-works 'root' widget.href}}

并在my-link-to-fails帮助器上进行非移位操作。所以实际上两个例子都不同。一个有两个参数（例如：'root'和'/ widget / foo'），另一个只有一个（例如：'/ widget / foo'）。

<强> 2。无论如何，为什么第一个参数是'root'时它可以工作？

link-to helper第一个参数必须是routeName。这个帮助器还可以接收第二个参数supplying an explicit dynamic segment value，它将它的值附加到已解析的路径。这就是你的论点被解释的方式。如果您查看示例，则工作链接会解析为#//widget/foo。您可能会注意到那里有两个正斜杠，这是您已解决的路线#/ +您的分段值/widget/foo的结果。

第3。溶液吗

直接使用link-to helper：{{link-to 'widget' 'widget.href'}}并从href字符串中删除/widget/部分或执行以下操作：http://jsfiddle.net/tqFJ3/4/

帮助者:(这与直接使用link-to相同）

Ember.Handlebars.registerHelper('my-link-to-works', function() {
  // Do extra stuff here...
  return Ember.Handlebars.helpers['link-to'].apply(this, arguments);
});

更改您的小部件href并仅保留动态细分：

App.IndexRoute = Ember.Route.extend({
    model : function() {
        return {
            widgets: [
              { href: 'foo' },
              { href: 'bar' },
              { href: 'baz' }
            ]
        };
    }
});

在ember.js中重载“link-to”帮助器

2 个答案: