Question

我正在使用Angularjs和Ui-router。我可以用HTML调用ui-sref页面。我想在使用ui-router时从控制器调用新页面。你怎么做我已经给出了以下代码。

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

        }
        }
    })

和下面的html

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

我要调用状态更改或调用新页面 $state.go('results',"");职位。你是怎么做到的。

$state.go似乎不起作用。我想转到结果页面

Answer 1

您必须在控制器中注入$state

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

然后，你可以使用它

$state.go('results');

Answer 2

您必须使用$state.go('results');代替$state.go('results', "");。第二个字段用于设置$state.go方法的选项。我猜它没有用，因为你把它留作空字符串。如果你不在那里放任何东西，它将使用默认值。

angularjs ui-router：如何从控制器

2 个答案: