angularjs UI-Router: Wie Status oder Seite von innerhalb Controller

Ich benutze Angularjs und Ui-Router. Ich kann die Seiten mit ui-sref aus HTML aufrufen. Ich möchte eine neue Seite vom Controller aufrufen, wenn Sie den UI-Router verwenden. Wie machst du es? Ich habe den Code unten angegeben.angularjs UI-Router: Wie Status oder Seite von innerhalb Controller

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',""); 

     } 
     } 
    })

und html unter

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

I hv die Zustandsänderung zu nennen oder eine neue Seite an $state.go('results',""); Position zu nennen. Wie machst du das.

$state.go scheinen nicht zu funktionieren. Ich möchte zu den Ergebnissen gehen seite

Quelle

2016-03-23 Ravi

Sie müssen $state.go('results'); statt $state.go('results', ""); verwenden. Das zweite Feld dient zum Einstellen der Optionen der Methode $state.go. Ich denke, es funktioniert nicht, weil Sie dies als eine leere Zeichenfolge belassen. Wenn Sie dort nichts eingeben, werden die Standardwerte verwendet.

Quelle

2016-03-23 07:53:20

verwenden kann ich versucht haben, dass auch, aber es funktioniert nicht. Die Ansicht befindet sich immer noch auf der Hilfeseite. Ist die Art, die ich definiere, korrekt. Ich weiß nicht, wo ich Fehler mache – Ravi

Könnten Sie eine console.log setzen ("test"); Nachricht in Ihrer Methode, die Sie anrufen? Auf diese Weise können wir prüfen, ob die Methode aufgerufen wird oder nicht. –

Methode wird aufgerufen, ich habe eine Warnung und es wird aufgerufen. Das Problem ist in $ state.go. – Ravi

Sie haben $state in Ihrem Controller

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

Dann zu injizieren, können Sie es

$state.go('results');

Quelle

2016-03-23 08:02:31 ddepablo

angularjs UI-Router: Wie Status oder Seite von innerhalb Controller

Antwort

Verwandte Themen