$ stateProvider不在子路由下工作

Question

我想从banks.loan_plans.edit州进入banks.loan_plans州。

然而，当我点击蓝色按钮时。网址已从

更改

  

http://dev.co/admin.html#/banks/101/loan_plans/

到

  

http://dev.co/admin.html#/banks/101/loan_plans/edit/101/8

然而，它仍然保持相同的状态和控制器。

未触发loanPlanEditCtrl

按钮链接按钮的HTML

<a ui-sref="banks.loan_plans.edit({bank_id:bank_id, loan_plan_id: plan.id})">
    <button class="btn btn-info ">Edit</button>
</a>

$ stateProvider

  .state('banks', {
      url: '/banks',
      template: '<div ui-view class="fade-in"></div>',
      resolve: load(['js/services/bank.js', 'js/controllers/banks.js'])
  })
  .state('banks.loan_plans', {
      url: '/:bank_id/loan_plans',
      controller: 'loanPlanBaseCtrl',
      templateUrl: 'admin_tpl/loan_plan/index.html',
      resolve: load(['js/controllers/loan_plan.js'])
  })
  .state('banks.loan_plans.edit', {
      url: '/edit/:bank_id/:loan_plan_id',
      controller: 'loanPlanEditCtrl',
      templateUrl: 'admin_tpl/loan_plan/form.html',
  })

父状态的HTML

<div ui-view class="wrapper-md" ng-controller="loanPlanIndexCtrl">
    <div class="panel panel-default">
        <div class="panel-body">
            <table class="table table-bordered table-hover table-condensed">
                <tr style="font-weight: bold">
                    <td>Name</td>
                    <td>Description</td>
                    <td>LowerRate</td>
                    <td>HigherRate</td>
                    <td>Operation</td>
                </tr>
                <tr ng-repeat=" plan in loan_plans ">
                    <td>
                        {{ plan.name || 'empty' }}
                    </td>
                    <td>
                        {{ plan.description || 'empty' }}
                    </td>
                    <td>
                        {{ plan.lowerbound_rate || 'empty' }}
                    </td>
                    <td>
                        {{ plan.upperbound_rate || 'empty' }}
                    </td>
                    <td>
                        <a ui-sref="admin.banks.loan_plans.edit({bank_id:bank_id, loan_plan_id: plan.id})">
                            <button class="btn btn-info ">Edit</button>
                        </a>
                    </td>
                </tr>
            </table>
        </div>
    </div>

Child声明'HTML

<div class="wrapper-md" ng-controller="loanPlanEditCtrl">        
  I'm child
</div>