$state config, nested views, and redirects

ionic-v1
1

For the life of me, I can’t get login.html to load. I’ve tried to make the state abstract or remove the inline template property in auth state config so it wouldn’t have another ion-view. Hopefully, its something easy I’m missing. Weird thing is, I replicated the same structure with just ui-view and it works perfectly fine. This is just auth/login module ive added to an ionic tabs template from cli install.

<body ng-app="app" ng-strict-di>
  <ion-nav-view></ion-nav-view>
</body>


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

      .state('auth', {
        redirectTo: 'auth.login',
        url: '/auth',
        template: '<ion-view hide-nav-bar="true"></ion-view>'
      })
      .state('auth.login', {
        url: '/login',
        templateUrl: './login.html',
        controller: 'LoginCtrl',
        controllerAs: '$ctrl'
      })
      .state('auth.login.phoneAuth', {
        url: '/phoneLogin',
        templateUrl: './mobile-login.html',
        controller: 'LoginCtrl',
        controllerAs: '$ctrl'
      })
      .state('auth.login.social', {
        url: '/socialLogin',
        templateUrl: './social-login.html',
        controller: 'LoginCtrl',
        controllerAs: '$ctrl'
      });

    $urlRouterProvider.otherwise('/auth/login');
  });

//login template

<ion-view hide-nav-bar="true">
  <ion-content>
    <h1>Login</h1>
  </ion-content>
</ion-view>



//tried to do this as well

<ion-content>
  <h1>Login</h1>
</ion-content>