Question

我在route js文件中得到transition数据，如下所示：

beforeModel(transition) { console.log(transition)  }

我想像这样在控制器的函数中使用它：

import Controller from '@ember/controller';

export default class ListingsController extends Controller {

    get pageTitle() {
        if (this.transition.targetName == 'foo') {
        return 'page title';

        }
      }

}

然后我要显示如下结果：

<h1>{{this.pageTitle}}</h1>

我找不到将transition数据从路由传递到控制器的方法。有什么想法吗？

Answer 1

尽管您可以从技术上可以像{KathirMagaesh所建议的那样，利用beforeModel通过this.controllerFor获取控制器，但我实际上并不主张这种解决方案。绝对不是正常或预期的Ember模式。此外，如果您查看transition api，将不会引用transition.targetName。如果这样做有效，则这是私有api，因此很脆弱。

如果您需要根据当前路线更改属性，则应使用public router service，它为此提供了一些有用的属性！

例如，在您的控制器中，您可以具有一个计算属性，该属性可以利用路由器服务来确定页面标题应为

import Controller from '@ember/controller';
import { computed } from '@ember/object';
import { inject } from '@ember/service';

// this injects the router service into our component via Ember's DI framework
router: inject(),
export default Controller.extend({
  pageTitle: computed('router.currentRouteName', function(){
     let currentRoute = this.router.currentRouteName;
     if(currentRoute === 'foo'){
        return 'page title';
     } 
     // do other stuff for other routes. 
  })
})

这利用了currentRouteName，这是句点分隔的名称，例如foo.bar。您还可以通过currentURL访问网址，网址为/foo/bar

PS。由于我还没有使用过ES6类，因此提供了旧式的余烬解决方案。您可能需要在我使用@computed函数的地方使用@tracked装饰器或computed。我只了解RFC和awesome blog posts中的Octane余烬样式，但与所涉内容无关。

PPS。如果您使用的是旧余烬，则当前路径名称/ URL属性在应用程序控制器上可用。

Answer 2

在 beforeModel 挂钩中使用

this.controllerFor（currentrRouteName）.set（'transition'，transition）;

这将在当前路由器的控制器中设置过渡属性。

有关controllerFor()

的更多信息

在EmberJS中，如何在控制器中使用转换数据？

2 个答案: