ember.js 如何为嵌套的动态路由渲染ember模板?

cngwdvgl  于 2022-11-05  发布在  其他
关注(0)|答案(1)|浏览(166)

js ',我已经声明了一些嵌套路由,如下所示:

Router.map(function() {
  this.route('index', { path: '/' })
  this.route('orders', function() {
    this.route('details', { path: '/:order_id' });
  });
  this.route('not-found', { path: '/*path' });
});

这里的orders.details模板没有渲染,但它将转到正确的路径文件,路径文件如下:

import Route from '@ember/routing/route';

export default Route.extend({
  model(params) {
    const { order_id } = params;
    console.log('params', params);
    return order_id;
  },
  renderTemplate() {
    this.render('orders/details')
  }
});

我还在orders文件夹中以嵌套方式声明了该模板:

这并不呈现orders/details模板,它总是转到orders模板。下面是我的orders/details.hbs模板:

<h2>Order {{this.model}}</h2>
{{outlet}}

以下是我导航到路线的方式:{{#link-to 'orders.details' order.id}}{{order.description}}{{/link-to}}

2skhul33

2skhul331#

正如@Gaurav所说,看看您是否忘记在订单模板中使用{{outlet}}

{{!-- Orders.hbs --}}
{{!--  any content for orders--}}
{{outlet}} {{!-- orders.details will load here--}}

因此,如果您的订单模板中不包含{{outlet,则无法加载orders.details}}

相关问题