Question

您好，并提前感谢您的帮助。我正在使用ember.js制作一个基本网站。我有一个每个循环，我希望它在链接到外部网站时显示变量（例如google.com，我已将其存储为不同的变量）。

出于某种原因，当我在每个循环内部进行操作时，我收到错误，“此链接处于非活动状态，因为其中至少有一个参数目前具有空值/未定义值，或者提供的路线名称无效。“我似乎无法弄清楚如何在点击时将其转到外部网站。这是我的每个循环和示例json。

{{#each}}
      {{#link-to 'theme' theme tagName="tr"}}
          <td class="noWrap">{{#link-to 'theme' title}}{{title}}{{/link-to}}</td>
          <td>{{#link-to 'theme' this}}<img {{bind-attr src="image"}} \>{{/link-to}}</td>
          <td class="tdCenter"><a {{bind-attr href="link"}}>{{price}}</a></td>
          <td>{{description}}</td>
          <td class="tdCenter">{{columns}}</td>
      {{/link-to}}
{{/each}}

{
  id: 1,
  title: 'Title',
  price: '$10',
  description: 'random description',
  columns: 1,
  link:'https://google.com',
  image: 'images/image.jpg'
}

这是我的主题路线

App.ThemeRoute = Ember.Route.extend({
  model: function(params) {
    return App.THEMES.findBy('title', params.title); 
  }
});

如果您有任何想法，请告诉我。再次感谢！

David B

Answer 1

如果用{{#link-to 'theme' theme tagName="tr"}}替换<tr>，表格行将在没有链接的情况下呈现（除非这是不可接受的，不幸的是link-to帮助者的目的是我不清楚。）

所以结果就像是，

http://emberjs.jsbin.com/wuvazica/1#/theme/1

http://emberjs.jsbin.com/wuvazica/1/edit

<强> HBS

<script type="text/x-handlebars" data-template-name="theme">
  <table>
    {{#each}}
      <tr>
          <td class="noWrap">{{#link-to 'theme' title}}{{title}}{{/link-to}}</td>
          <td>{{#link-to 'theme' this}}<img {{bind-attr src="image"}} \>{{/link-to}}</td>
          <td class="tdCenter"><a {{bind-attr href="link"}}>{{price}}</a></td>
          <td>{{description}}</td>
          <td class="tdCenter">{{columns}}</td>
       </tr>
{{/each}}
</table>
  </script>

顺便说一下，显示的错误是由theme中的参数{{#link-to 'theme' theme tagName="tr"}}引起的，如果它被删除，错误就会消失，但渲染的html将无法正常运行（至少我在我提供的快速示例中注意到的，因为那时{{#link-to}}帮助器。

Ember.js每个循环都有外部/出站链接

1 个答案: