Angularjs 未调用子状态的控制器和模板。从孩子的兄弟姐妹'；中国的母国

我不熟悉angular js和ui路由器。我计划设计一个角度JSUI路由应用程序。我有两个州，州a和州B。州B有子州。 在应用程序的登录页（即查询面板）上，正确调用了状态a。与登录页的交互应显示作为状态B的子状态路由的结果

app.js

$stateProvider
  .state('A', {
    url: '/queryPanel',
    templateUrl: 'queryParameterView.html'
  })
  .state('B', {
    url: '/resultPanel',
  })
  .state('B.child', {
    url: '/overView',
    templateUrl: 'xyz.html',
    controller: function($scope) {
      $scope.dogs = ['Bernese', 'Husky', 'Goldendoodle'];
    }
  });

所以基本上我想从状态A转换到状态B的子状态（即B.child）

谢谢
每当您有子状态时，您必须确保在父状态的视图中，它有一个
ui视图
指令，以便子状态可以驻留在它上面

我在
$state
配置中看到的一个直接问题是，在
B
状态下，您没有
模板
或
模板URL
属性。你应该这样做：

$stateProvider
  .state('A', {
    url: '/queryPanel',
    templateUrl: 'queryParameterView.html'
  })
  .state('B', {
    url: '/resultPanel',
    template:'<div ui-view></div>' // or you can use templateUrl
  })
  .state('B.child', {
    url: '/overView',
    templateUrl: 'xyz.html',
    controller: function($scope) {
      $scope.dogs = ['Bernese', 'Husky', 'Goldendoodle'];
    }
  });

$stateProvider
.州（'A'{
url:“/queryPanel”，
templateUrl:'queryParameterView.html'
})
.州（'B'{
url:“/resultPanel”，
模板：“”//或者您可以使用templateUrl
})
.州（“B.儿童”{
url:“/概述”，
templateUrl:'xyz.html'，
控制器：功能（$scope）{
$scope.dogs=['Bernese'、'Husky'、'Goldendoodle']；
}
});

编辑：添加
嘿，谢谢你的回答，我尝试了这个解决方案，但没有成功。我的URL也没有更改（之前更改为子状态URL）。@AjinkyaKale您确实需要调试它并找出问题所在。我为您添加了一个工作plnkr，以备您需要参考。非常感谢您的帮助！plnkr是非常好的参考。
$stateProvider
  .state('A', {
    url: '/queryPanel',
    templateUrl: 'queryParameterView.html'
  })
  .state('B', {
    url: '/resultPanel',
    template:'<div ui-view></div>' // or you can use templateUrl
  })
  .state('B.child', {
    url: '/overView',
    templateUrl: 'xyz.html',
    controller: function($scope) {
      $scope.dogs = ['Bernese', 'Husky', 'Goldendoodle'];
    }
  });