Transitioning from views in Ionic

I am building an app using Ionic Framework. I am trying to move to a new view/page.html, but when I click on the list it doesn't go to the new view/page. However the URL changes. Why am I having this issue and what is the problem?

This is the Html

   <a class="item item-icon-left item-icon-right" ng-click="viewCarLog()">
       <i class="icon ion-model-s"></i>
       Car Log
       <i class="icon ion-chevron-right ion-accessory"></i>
   </a>

Here is the app.js

.state('app', {
      abstract: true,
      url: "/app",
      templateUrl: "app/layout/menu-layout.html"
    })

    .state('app.home', {
      url: "/home",
      views: {
        "tab-home": {
          templateUrl: "app/home/home.html"
        }  
      }   
    })

    .state('app.settings', {
      url: "/settings",
      views: {
        "tab-settings": {
          templateUrl: "app/settings/settings.html"
        }  
      }   
    })

    .state('app.car-log', {
    url: "/car", 
    templateUrl: "app/car/car-log.html", 
    controller: 'CarLogCtrl'
    })

    .state('app.location', {
    url:"/location", 
    templateUrl: "app/location/location.html"
    })

    .state('login', {
    url:"/login", 
    templateUrl: "app/login/login.html"
    });

This is the Home controller that is trying to open a new view/page

    (function() {
    'use strict';

    angular.module('myDrive').controller('HomeCtrl', ['$state', '$scope', HomeCtrl]);

    function HomeCtrl($state, $scope) {
        var vm = this;
        // TODO:: Getting Data from Server (WEB API)
        // 

        $scope.viewCarLog = function() {
            $state.go("app.car-log");
        };
    };
})();

This is a CarLogCtrl. Currently empty as it functionality of this isn't yet implemented. Am I missing something in the controller to show the view?

(function() {
    'use strict';

    angular.module('myDrive').controller('CarLogCtrl', ['$state', '$scope', CarLogCtrl]);

    function CarLogCtrl($state, $scope) {
        var vm = this;
        // TODO:: Do something

    };
})();   

Looking for a help, and tips and guidance for this.

Found an issue with not being able to open a view. What happened was that in app.js a state needs to have a view included to display the page.

The following made it work.

 .state('app.car-log', {
    url: "/car", 
    views: { 
      "tab-home": {
        templateUrl: "app/car/car-log.html"
      }
    }
  })

Please correct me if I am wrong. But this worked to fix the issue I had.