仅在页面刷新后的Ember路由加载模板

Question

我有一个名为addon的路由的简单应用程序，它有静态模板。

当我通过{{link-to}}导航到它时，页面变为空白，但是当我刷新同一页面时，模板正在正确加载。

同样的问题发生在Route only loads on page refresh - Ember JS，但我的情况不同。

router.js

import Ember from 'ember';
import config from './config/environment';

const Router = Ember.Router.extend({
  location: config.locationType
});

Router.map(function() {
    this.mount('ember-engine-addon-demo', {as: 'routable'});
    /*this is only for addon components demo*/
    this.route('addon');
});

export default Router;

routes-＆GT; addon.js

import Ember from 'ember';

export default Ember.Route.extend({
});

templates-＆gt; index.hbs

{{#link-to 'routable'}}Click here to see routable engine in action{{/link-to}}
<br><br>
<!--this is only for addon components demo-->
{{#link-to 'addon'}}Click here to see ember addon in action{{/link-to}}

templates-＆gt; application.hbs

<h2 id="title">This echo is from host app at app/templates/application.hbs</h2>
<!-- load from engine and engine addon -->
{{outlet}}

模板 - ＆GT; addon.hbs

<!--this is only for addon components demo-->
<div style="padding-left:20px; color:green">This echo is from /app/templates/addon.hbs </div>
<div style="padding-left:50px; padding-top:20px; color:red">{{ember-engine-addon-demo}}</div>