javascript 离子改变位置不起作用
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/23928982/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
ionic change location won't work
提问by HymanTurky
i'm new in ionic ( just a little less in angularjs ) .
我是 ionic 的新手(在 angularjs 中只是少了一点)。
i'm trying to do a simple switch between two views:
我正在尝试在两个视图之间进行简单的切换:
HTML
HTML
<body ng-app="starter" animation="slide-left-right-ios7">
<!--
The nav bar that will be updated as we navigate between views.
-->
<ion-nav-bar class="bar-stable nav-title-slide-ios7">
<ion-nav-back-button class="button-icon icon ion-ios7-arrow-back">
Back
</ion-nav-back-button>
</ion-nav-bar>
<ion-nav-view name="intro"></ion-nav-view>
<ion-nav-view name="login"></ion-nav-view>
<ion-nav-view name="home"></ion-nav-view>
<ion-nav-view name="pizze"></ion-nav-view>
<ion-nav-view name="sponsor"></ion-nav-view>
<ion-nav-view name="scontrino"></ion-nav-view>
</body>
APP.js
应用程序js
.config(function($stateProvider, $urlRouterProvider) {
// Ionic uses AngularUI Router which uses the concept of states
// Learn more here: https://github.com/angular-ui/ui-router
// Set up the various states which the app can be in.
// Each state's controller can be found in controllers.js
$stateProvider
.state('intro', {
url: '/intro',
views: {
'intro': {
templateUrl: 'templates/intro.html',
controller: 'IntroCtrl'
}
}
})
.state('login', {
url: '/login',
views: {
'login': {
templateUrl: 'templates/login.html',
controller: 'LoginCtrl'
}
}
})
$urlRouterProvider.otherwise('/intro');
});
Controllers.js
控制器.js
angular.module('starter.controllers', [])
.controller('IntroCtrl', function($scope,$location) {
$location.url("/login");
})
.controller('LoginCtrl', function($scope,$location) {
})
Intro is shown correctly but when it tries to change location to "login.html" it says:
Intro 显示正确,但是当它尝试将位置更改为“login.html”时,它说:
TypeError: Cannot read property 'querySelectorAll' of undefined
at cancelChildAnimations (http://localhost:8000/www/lib/ionic/js/ionic.bundle.js:30611:21)
at Object.leave (http://localhost:8000/www/lib/ionic/js/ionic.bundle.js:30176:11)
at Object.leave (http://localhost:8000/www/lib/ionic/js/ionic.bundle.js:38411:24)
at updateView (http://localhost:8000/www/lib/ionic/js/ionic.bundle.js:41540:31)
at eventHook (http://localhost:8000/www/lib/ionic/js/ionic.bundle.js:41501:17)
at Scope.$broadcast (http://localhost:8000/www/lib/ionic/js/ionic.bundle.js:21190:28)
at $state.transition.resolved.then.$state.transition (http://localhost:8000/www/lib/ionic/js/ionic.bundle.js:33975:22)
at wrappedCallback (http://localhost:8000/www/lib/ionic/js/ionic.bundle.js:19894:81)
at http://localhost:8000/www/lib/ionic/js/ionic.bundle.js:19980:26
at Scope.$eval (http://localhost:8000/www/lib/ionic/js/ionic.bundle.js:20906:28)
What could be the problem???
可能是什么问题呢???
Thanks!
谢谢!
回答by Mathews
Try this
试试这个
angular.module('starter.controllers', [])
.controller('IntroCtrl', function($scope,$state) {
$state.transitionTo("login");
})
.controller('LoginCtrl', function($scope,$location) {
})
回答by Clawish
You are using the view names wrong. In a state, the view's name
您使用的视图名称错误。在状态下,视图的名称
views: {
'_name_': {
}
is used for different navigation histories for different views.
用于不同视图的不同导航历史记录。
Say you have two tabs, home
and pizza
, and you want both to have several pages, then the view name comes in handy.
假设您有两个选项卡home
和pizza
,并且您希望两者都有多个页面,那么视图名称就派上用场了。
For your example it is important to know, how you want the views to be used. I set up an example for you, making the views accessible in tabs. See here for that example: http://plnkr.co/edit/Yd5ehQd0wnwlPzP0KYnp?p=preview
对于您的示例,重要的是要知道您希望如何使用视图。我为您设置了一个示例,使视图可以在选项卡中访问。有关该示例,请参见此处:http: //plnkr.co/edit/Yd5ehQd0wnwlPzP0KYnp?p=preview