set default view for ui-view in angular
<p>I have a simple angular project structure</p>

<pre><code>app
   index.html
   view
       main.html
       home.html
       landingPage.html
</code></pre>

<p>Index.html looks like</p>

<pre><code>&lt;body ng-app="myApp"&gt;
  &lt;div ui-view&gt;
  &lt;/div&gt;
&lt;/body&gt;
</code></pre>

<p>App.js file looks like</p>

<pre><code>$urlRouterProvider.otherwise('/landingPage');
 $stateProvider.state('landingPage', {
            url: '/landingPage',
            abtract: true,
            templateUrl: 'view/landingPage.html'
 })
 .state('landingPage.home', {
            url: '/home',
            templateUrl: 'view/home.html'
 }).state('landingPage.main', {
            url: '/main',
            templateUrl: 'view/main.html'
 });;
</code></pre>

<p>and 
landing page looks like </p>

<pre><code>    &lt;header&gt;&lt;/header&gt;
    &lt;div&gt;
            &lt;div ui-view&gt;
            &lt;/div&gt;
    &lt;/div&gt;
</code></pre>

<p>When I run the app I see the header correctly but do not see the home.html content. How do I make home.html default every time?
As you can see I have abstract true but that does not work. I also tried ng-include which works but gets error <code>TypeError: Cannot read property 'insertBefore' of null</code></p>

<p>sample <a href="https://plnkr.co/edit/5IUbo8gzcM2DDToLYbCx?p=preview" rel="nofollow noreferrer">plunker</a> HOME should have been displayed on running but nothing shows</p>