2014-02-14 23 views
0

遇到一個問題,即在退出時不會銷燬索引。Ember.js - 嵌套路徑上的索引在出口處複製/不銷燬

控制器/路線:

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> 

來回切換概覽(索引)選項卡和嵌套路線結果如下:ember duplication

+0

任何機會,你可以提供的jsfiddle或jsBin? – chopper

+0

@chopper嘆息...是的。 –

+0

對不起,這樣調試只是有點困難 – chopper

回答

3

您在「帳戶/索引」模板中缺少關閉</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/

+0

Lmao。那是愚蠢的。我甚至沒有注意到它。非常感謝。 –

+0

沒問題。別擔心,它發生在我們最好的:) – chopper