代码之家  ›  专栏  ›  技术社区  ›  Niclas Nordling

Ionic/AngularJS无法使状态或控制器工作

  •  1
  • Niclas Nordling  · 技术社区  · 8 年前

    我对爱奥尼亚的标签有问题。我正在爱奥尼亚v1中创建一个基本的酒店应用程序,作为一个学校项目,但我无法让我的选项卡或控制器正常工作。没有找到状态,它会立即将我指向$urlRouterProvider中提供的链接。否则我密切关注了我的教师标签示例,以及在爱奥尼亚启动新标签项目时发现的示例。大约两天前,我确实让它简单地工作了一下,但当我今天返回项目时,它只是一片空白(除了我在索引文件nav视图中键入的内容)。

    这是我的应用程序。js文件

    angular.module('sthlmBB', ['ionic', 'sthlmBB.controllers'])
    
    .config(function($stateProvider, $urlRouterProvider) {
    
    $stateProvider
    .state("tabs", {
      url: "/tab",
      abstract: true,
      templateUrl: "templates/tabs.html",
    })
    
    .state("tabs.home", {
      url: "/home", 
      views: {
        "home-tab": {
         templateUrl: "templates/home.html",
         controller: "HotelCtrl"
      }
    }
    })
    
    .state("tabs.bookings", {
      url: "/bookings",
      views: {
        "bookings-tab": {
         templateUrl: "templates/bookings.html",
         controller: "BookingsCtrl"
      }
    }
    })
    
    .state("tabs.events", {
      url: "/events",
      views: {
        "events-tab": {
        templateUrl: "templates/events.html",
        controller: "EventsCtrl"
      }
    }
    });
    
    $urlRouterProvider.otherwise("/tabs/home");
    
    })
    

    控制器。js公司

    angular.module('sthlmBB.controllers', [])
    
    .controller('HotelCtrl', function($scope, $http, $state){
      var url = 'link to php file';
      $http.get(url).success(function(response){
      $scope.rooms = response.data;
    
      console.log('HotelCtrl Test')
      console.log($state);
    })
    
    $scope.data = { };
    
    $scope.submit = function(){
      var url = 'link to another php file';
      $http.post(url, $scope.data)
        .then(function(response){
          $scope.response = response;
          console.log($scope.response);
        });
    }
    })
    

    在索引中。html文件我有两个应用程序的链接。js和控制器。头部为js,身体为ion nav视图。

    选项卡。html

    <ion-tabs class="tabs-icon-top tabs-color-active-positive">
    
      <ion-tab title="Home" icon="ion-home" href="#/tab/home">
        <ion-nav-view name="home-tab"></ion-nav-view>
      </ion-tab>
    
      <ion-tab title="My Bookings" icon="ion-home" 
      href="#/tab/bookings">
        <ion-nav-view name="bookings-tab"></ion-nav-view>
      </ion-tab>
    
      <ion-tab title="Events" icon="ion-home" 
      href="#/tab/events">
        <ion-nav-view name="events-tab"></ion-nav-view>
      </ion-tab>
    </ion-tabs>
    

    我对这方面还不太熟悉,所以很可能只是新手犯了个错误。如果能得到任何帮助,我将不胜感激!

    1 回复  |  直到 8 年前
        1
  •  0
  •   Niclas Nordling    8 年前

    这是应用程序中的一个拼写错误。js处于url为“/选项卡”的第一个状态,而url应为“/选项卡”。 脸掌