Problemas com rotas. Conteúdo ainda permanece em branco! | Ionic 1 parte 1: desenvolvimento de aplicações híbridas mobile

Olá, professor. Eu quero aprender o que o senhor ensina, para isso eu estudo e depois tento fazer um projetinho diferente em outros arquivos. Estou criando um pequeno só para eu aprender mais sobre as rotas, mas me deparo com um problema, pois na hora de testar, a aplicação fica toda branca. Segue o código:

HTML:

<body ng-app="starter" ng-controller="listagemEmpresa">

    <ion-pane>
      <ion-header-bar class="bar-stable">
        <h1 class="title">Missão Segura</h1>
      </ion-header-bar>

       <ion-nav-view></ion-nav-view>

TELA INICIAL (A QUE É A PRIMEIRA APARECER):

<ion-view>
     <ion-nav-title>Missão Segura</ion-nav-title>
<ion-content>
         ion-content>
          <!-- aqui fica a imagem-->
          <label class="item item-input item-select">
          <div class="input-label">Setor responsável</div>
          <select>
           <option ng-repeat="empresa in listaEmpresa">{{empresa}}</option>   
           </select>
          </label>

          <button class="button button-full button-positive" href="#/gcmPerguntas">Acessar Sistema</button>

</ion-content>
</ion-content>
</ion-view>

CONTROLLER

angular.module('starter')
.controller('listagemEmpresa', function ($scope){

      $scope.listaEmpresa = ['Samarco', 'Vale', 'Petrobras'];
});

ROTAS:

angular.module('starter')
.config(function($stateProvider, $urlRouterProvider){

    $urlRouterProvider.otherwise('index.html')

    $stateProvider

    .state('telaInicial',{
      url: '/telainicial',
      templateUrl: 'templates/telaInicial.html',
      controller:'TelaInicioController'
})

Mergulhe em programação