2016-11-27 2 views
1

상태에 문제가 있습니다 (어떻게 작동하는지 이해가 안됩니다).이오니아 상태가 작동하지 않습니다.

좋아 내 app.js의 코드보기이 :

.... 
app.config(function($stateProvider, $urlRouterProvider, $ionicConfigProvider) { 
// $ionicConfigProvider.views.transition('none'); 
$stateProvider 
      .state('app', { 
      url: '/app', 
      templateUrl: 'tpl/home.html', 
      controller: 'AppController', 
      abstract: true 
      }) 
      .state('app.aquarium', { 
      url: '/aquarium/index', 
      views: { 
       'menuContent': { 
       templateUrl: 'tpl/aquarium/index.html', 
       controller: 'AquariumIndexCtrl', 
       } 
      } 
      }) 
.... 
    $urlRouterProvider.otherwise('/app/aquarium/index'); 

.... 

app.controller('AppController', function($scope) { 
    console.log("App"); 
}); 
app.controller('AquariumIndexCtrl', function($scope) { 
    console.log("Akwaria"); 
}); 
.... 

나는이에 HREF가 된 index.html에서 상태 :

<a class="item item-icon-left" href="#/app/aquarium/index"> 
    <i class="icon"><img src="img/aquarium.png" /></i> 
    Aq 
    </a> 

그러나 모든 시간이 나는 상태에서 파일을 참조하십시오 " app "(tpl/home.html).

왜 내 링크는 일을 해달라고 왜 여전히 파일을로드 TPL/home.html을 때 처음에 나는

$urlRouterProvider.otherwise('/app/aquarium/index'); 

에 "재"를 사용하여 응용 프로그램? 고마워요 :)

답변

1

먼저 당신이 그들을 inyect 때 당신이 문자열의 배열로 종속성을 전달하는 것이 좋습니다. 그렇지 않다면, 당신이 생산에 uglify 시간에 의해 그들에게 문제가됩니다.

상태는 내가 당신의 인덱스를 설정하려는 생각이 경우, 당신은 이전에 stablished 한 UI-뷰에 직접 따라 달라 상태 문제를 해결

app.config([ 
    $stateProvider, 
    $urlRouterProvider, 
    $ionicConfigProvider, 
    function($stateProvider, $urlRouterProvider, $ionicConfigProvider) { 
}]) 

. ui-views에 대해 state 나 url을 통해 HTML을 채우는 상자로 생각하십시오. 상태에 따라 앱을 구조화하면 URL이 표시됩니다.

사용 상태 :

이 index.html을 가정, 당신은 상태에서 HTML을 채우기 위해 UI를-뷰를 생성해야합니다.

ui-view를 선언 할 지 모르겠다. 그렇다고 가정합니다. 추상 상태에서는보기를 사용하여 UI 뷰에 호출해야하며 적어도 나중에 비워 두지 않으면 나중에 다시 호출 할 필요가없는 내용으로 채워야합니다.

app.config([ 
    $stateProvider, 
    $urlRouterProvider, 
    $ionicConfigProvider, 
    function($stateProvider, $urlRouterProvider, $ionicConfigProvider) { 

// $ionicConfigProvider.views.transition('none'); 
$stateProvider 
      .state('app', { 
      url: '/app', 
      views: { 
      'menuContent': {} 
      }, 
      abstract: true 
      }) 
      .state('app.aquarium', { 
      url: '/aquarium/index', 
      views: { 
       'menuContent': { 
       templateUrl: 'tpl/aquarium/index.html', 
       controller: 'AquariumIndexCtrl', 
       } 
      } 
      }) 
.... 
    $urlRouterProvider.otherwise('/app/aquarium/index'); 

}]) 

당신이 원하는대로, 당신은 많은 UI-전망을 가질 수 있습니다 당신이 호출 상태에 따라 dinamically 채워집니다 상자와 같은 UI 뷰 menuContent에 대해 생각하고 당신이 그들을 설정 한 경우에만 하나씩로드 보기 : {} 상태.

<a class="item item-icon-left" ui-sref="app.aquarium"> 
    <i class="icon"><img src="img/aquarium.png" /></i> 
</a> 
:

마지막으로 당신은 UI-(SREF) 대신 호출하는 HREF의 개의 다른 상태를 사용해야합니다

관련 문제