javascript - Ember.js - 嵌套路由上的索引在退出时复制/不销毁

Question

遇到 ember 退出时未销毁索引的问题。

Controller /路由:

App.AccountRoute = Ember.Route.extend({
    activate: function () {
        //Doing some stuff with login state here. Not important.
    }
});

App.AccountController = Ember.Controller.extend({
    needs: ['application'], //dependency
    account: Ember.computed.alias('controllers.application.accountData'),
    states: Ember.computed.alias('controllers.application.states'),
    userToken: Ember.computed.alias('controllers.application.userToken'),

    tabs: [{'pinned': true, 'name': { 'nestedLink': 'account.index', long: 'Account Overview' }}, {'name': { 'nestedLink': 'account.edit-profile', long: 'Edit Your Company Profile' }}, {'name': { 'nestedLink': 'account.edit-listings', long: 'Edit Your Company Listings' }}, {'name': { 'nestedLink': 'account.edit-payment-methods', long: 'Edit Your Saved Payment Methods' }}, {'name': { 'nestedLink': 'account.view-orders', long: 'View Orders' }}],
});

App.AccountIndexController = Ember.Controller.extend({
    needs: ['account']
});

这是路由器:

App.Router.map(function () {
        //...
    this.resource('account', function() {
        this.route('edit-profile');
        this.route('edit-listings');
        this.route('edit-payment-methods');
        this.route('view-orders');
    });
});

帐户模板的设置如下所示，其中包含每个嵌套路由的链接，例如:{{#linkTo account.index}}{{/linkTo}} {{# linkTo account.view-orders}}{{/linkTo}}

<script type="text/x-handlebars" data-template-name="account">
            <h2>Account for {{account.name.company}}</h2>
            <hr />
            <div class="row">
                <div class="col-md-2 account-sidebar">
                    <ul class="list-group">
                        {{#each tabs}}
                            {{#if pinned}}
                                {{#linkTo name.nestedLink class="list-group-item pinned-item"}}
                                    {{name.long}}
                                {{/linkTo}}
                            {{else}}
                                {{#linkTo name.nestedLink class="list-group-item"}}
                                    {{name.long}}   
                                {{/linkTo}}
                            {{/if}}
                        {{else}}
                            <p class="text-danger">There are no options for your account.</p>
                        {{/each}}
                    </ul>
                </div>
                <div class="col-md-10 account-content">
                    {{outlet}}
                </div>
            </div>
        </script>

        <script type="text/x-handlebars" data-template-name="account/index">
            <h3>Account Overview</h3>
        </script>

在概览(索引)选项卡和嵌套路由之间来回切换会导致:

Answer 1

您缺少结束语 </div>在您的“帐户/索引”模板中。应该是

<script type="text/x-handlebars" data-template-name="account/index">
   <h3>Account Overview</h3>
   <hr />
   <div class="row">
      <div class="col-md-6">
         <h4>Account Created:</h4>
         <p class="text-muted"></p>
      </div>

      <div class="col-md-6">
         <h4>Account Address:</h4>
         </p>
      </div>
   </div>
</script>

参见http://emberjs.jsbin.com/novib/3/