2016-03-23 18 views
1

Angularjs ve Ui yönlendiricileri kullanıyorum. HTML'den ui-sref ile sayfaları arayabiliyorum. UI yönlendiriciyi kullanırken denetleyiciden yeni bir sayfa aramak istiyorum. Nasıl yapmalısın? Aşağıdaki kodu verdim.angularjs yönlendiricisi: İç denetleyiciden durum veya sayfa nasıl değiştirilir

var app = angular.module('starter', ['ionic']) 

app.config(function($stateProvider, $urlRouterProvider) { 
    $urlRouterProvider.otherwise('/') 

    $stateProvider.state('home', { 
    url: '/home', 
    views: { 
    home: { 
     templateUrl: 'home.html' 
    } 
    } 
}) 

    $stateProvider.state('results', { 
    url: '/results', 
    views: { 
    results: { 
     templateUrl: 'results.html' 
    } 
    } 
}) 

$stateProvider.state('help', { 
    url: '/help', 
    views: { 
    help: { 
     templateUrl: 'help.html' 
    } 
    } 
}) 
}) 
.run(function($ionicPlatform) { 
    $ionicPlatform.ready(function() { 
    if(window.cordova && window.cordova.plugins.Keyboard) { 
     // Hide the accessory bar by default (remove this to show the accessory bar above the keyboard 
     // for form inputs) 
     cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true); 

     // Don't remove this line unless you know what you are doing. It stops the viewport 
     // from snapping when text inputs are focused. Ionic handles this internally for 
     // a much nicer keyboard experience. 
     cordova.plugins.Keyboard.disableScroll(true); 
    } 
    if(window.StatusBar) { 
     StatusBar.styleDefault(); 
    } 
    }); 
}) 
.controller ("mainCtrl", function($scope) { 
    $scope.devList1 = [ 
    {text:'Most Accurate', checked: false}, 
    {text:'Accurate', checked: false}, 
    {text:'Neutral', checked: false}, 
    {text:'Inaccurate', checked: false}, 
    {text:'Most Inaccurate', checked: false}]; 
    $scope.indexToShow = 0; 
    $scope.questionlist = ["one", "two" , "three", "four", "five"]; 

    $scope.imChanged = function(isChecked, index){  
      angular.forEach($scope.devList1, function (items) { 
       items.checked= false; 
      }); 
      $scope.devList1[index].checked=true; 
      $scope.okaychecked = true; 
     } 
    $scope.nextquestion = function(){ 
     $scope.okaychecked = false; 
     angular.forEach($scope.devList1, function (items) { 
       items.checked= false; 
      }); 
     if (($scope.indexToShow) < ($scope.questionlist.length - 1)){ 
      $scope.indexToShow = ($scope.indexToShow + 1) % $scope.questionlist.length; 
      } 
     else { 
      $state.go('home',""); 

     } 
     } 
    }) 

ve html ben durumları değişir arayın veya $state.go('results',""); pozisyonunda yeni bir sayfa çağırmak için hv

<body ng-app="starter" ng-controller = "mainCtrl"> 


<ion-nav-bar class="bar-positive"> 
</ion-nav-bar> 


    <ion-tabs class="tabs-positive" tabs-icon-top> 
    <ion-tab icon="ion-home" ui-sref="home"> 
     <ion-nav-view name="home"></ion-nav-view> 
    </ion-tab> 
    <ion-tab icon="ion-help" ui-sref="help"> 
     <ion-nav-view name="help"></ion-nav-view> 
    </ion-tab> 
    </ion-tabs> 

    <script type="text/ng-template" id="home.html"> 
    <ion-view title="Single"> 
    <ion-content padding="true"> 
     <h2>Single Construct</h2> 
     <p>Here Single Constructs.</p> 
    </ion-content> 
    </ion-view> 
</script> 

    <script type="text/ng-template" id="results.html"> 
    <ion-view title="Results"> 
    <ion-content padding="true"> 
     <h2>Results</h2> 
     <p>Results here</p> 
    </ion-content> 
    </ion-view> 
</script> 

<script type="text/ng-template" id="help.html" > 
    <ion-view title="Multiple"> 

     <ion-content padding = "true">  
     <div class="card"> 
      <div class="item item-text-wrap" ng-repeat="item in questionlist track by $index" ng-show="$index == indexToShow"> 
        {{item}} 
       </div>   
     </div> 
     <ion-checkbox ng-repeat="items in devList1" ng-model="items.checked" ng-change="imChanged(items.checked, $index)" ng-value = "items">{{items.text}} 
      </ion-checkbox> 
     <div ng-show="okaychecked"> 
      <a class="button icon-right ion-chevron-right button-positive" ng-click = "nextquestion()" >NEXT</a> 
     </div> 
     </ion-content> 
    </ion-view> 
</script> 
    </body> 
</html> 

altında. Bunu nasıl yapıyorsun. Çalışmıyor gibi görünmüyor. Sonuçlar sayfasına gitmek için tıklayın

cevap

1

$state.go('results', ""); yerine $state.go('results'); kullanmanız gerekiyor. İkinci alan, $state.go yönteminin seçeneklerini ayarlamak içindir. Sanırım çalışmıyor, çünkü bunu boş bir ip olarak bırakıyorsun. Orada hiçbir şey koymazsanız, varsayılan değerleri kullanır.

+0

Bunu da denedim kullanabilirsiniz

.controller ("mainCtrl", function($scope, $state) { 

Sonra denetleyicisi $state enjekte etmek var ama çalışmıyor. Görünüm hala yardım sayfasında. Doğru tanımlamamın yolu. Nerede hata yaptığımı bilmiyorum – Ravi

+0

Bir console.log ("test") koyabilir misiniz; Aradığınız yöntemde mesaj var mı? Bu şekilde, yöntemi kontrol edip etmediğini kontrol edebiliriz. –

+0

yöntemi çağrılıyor, bir uyarı koydum ve aranıyor. Sorun $ state.go. – Ravi

2

Sen bunu

$state.go('results'); 
İlgili konular