title: How to define multiple views with parent child state using UI router?
body: <p>Is it possible to define multiple views in child state with parent child state relationship using UI-Router?</p>
  
  <p>I have the following code in my config</p>
  
  <pre><code>$urlRouterProvider.otherwise("/child");
  
  $stateProvider
    .state('parent', {
      abstract: true,
      views: {
        'parent': {
          templateUrl: "parent.html",
          controller: "parentCtrl as parentCtrl"
        },
      }
    })
    .state('parent.child', {
      url: '/child',
      views: {
        'state1@parent.child': {
          templateUrl: "child.html",
          controller: "childCtrl as childCtrl"
        },
  
      }
    });
  </code></pre>
  
  <p>I verify that my <code>parent.html</code> is showing up, but my <code>child.html</code> is not</p>
  
  <p>If I move my <code>child.html</code> to the parent views object like</p>
  
  <pre><code>$stateProvider
    .state('parent', {
      abstract: true,
      views: {
        'parent': {
          templateUrl: "parent.html",
          controller: "parentCtrl as parentCtrl"
        },
        'state1@parent.child': {
          templateUrl: "child.html",
          controller: "childCtrl as childCtrl"
        },
      }
    })
  </code></pre>
  
  <p>Than <code>child.html</code> works.</p>
  
  <p>I verify using <code>console.log($state.$current.name);</code> in my <code>parentCtrl</code> that my current state is <code>parent.child</code>.</p>
  
  <p>Can someone give me some hint?</p>
  
  <p>Thanks</p>