Question

我正在使用Ionic Framework构建应用程序。我正在尝试移动到新视图/ page.html，但是当我点击列表时，它不会转到新视图/页面。但是URL会更改。我为什么遇到这个问题，问题是什么？

这是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>

这是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"
    });

这是试图打开新视图/页面的家庭控制器

    (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");
        };
    };
})();

这是一个CarLogCtrl。目前是空的，因为它的功能尚未实现。我在控制器中遗漏了一些东西以显示视图吗？

(function() {
    'use strict';

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

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

    };
})();

寻求帮助，并提供相应的提示和指导。

Answer 1

发现无法打开视图的问题。发生了什么，在app.js中，状态需要包含一个视图来显示页面。

以下内容使其发挥作用。

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

如果我错了，请纠正我。但这有助于解决我遇到的问题。

从Ionic中的视图转换

1 个答案: