控制器在 Ionic 中被调用两次 (AngularJS)
Controller being called twice in Ionic (AngularJS)
在我的 angular 项目中,用户接受 EULA 然后自动重定向到他们的仪表板,但是,在这个重定向中,DashboardController 似乎被调用了两次,DashboardController 在路由本身上被调用,我已经检查过是否在模板中不小心再次调用了它,但我没有。下面是我的路线和控制器。无论我是直接访问 URL 还是通过 EULA 控制器上的重定向访问似乎都没有关系,我得到了相同的结果。
路线
.config(function($httpProvider, $stateProvider, $urlRouterProvider) {
$httpProvider.interceptors.push('httpRequestInterceptor');
$urlRouterProvider.otherwise('/');
$stateProvider
.state('login', {
url: '/',
templateUrl: 'templates/login.html',
data: {
requireLogin: false
}
})
.state('eula', {
url: '/eula',
templateUrl: 'templates/eula.html',
data: {
requireLogin: true
}
})
.state('dashboard', {
url: '/groups',
templateUrl: 'templates/dashboard.html',
data: {
requireLogin: true
}
})
});
控制器:
App.controller('DashboardController', ['$scope', 'RequestService', '$state', '$rootScope', function($scope, RequestService, $state, $rootScope){
alert('test');
}]);
有什么想法吗?
根据评论添加了我的 HTML
index.html
<body ng-app="App">
<ion-nav-bar class="bar-positive nav-title-slide-ios7" align-title="center">
<ion-nav-back-button class="button-icon ion-arrow-left-c"></ion-nav-back-button>
</ion-nav-bar>
<ion-nav-view class="slide-left-right"></ion-nav-view>
<ui-view></ui-view>
</body>
dashboard.html
<div class="groups" ng-controller="DashboardController">
<ion-view title="App">
<ion-nav-buttons side="right">
<a ui-sref="groupcreate"><span class="icon ion-ios-plus-outline"></span></a>
</ion-nav-buttons>
<ion-content class="padding">
<div class="row">
<div class="col-50" ng-repeat="group in groups">
{{ group }} 1
</div>
</div>
</ion-content>
</ion-view>
</div>
如果您使用 ui-router
,则不必使用 ng-controller
。您已经在 dashboard.html 中使用了它,另一个是由 ui-router
生成的 - 这就是它被击中两次的原因。
好的,经过长时间的调试和检查,我发现这是一个与 ionic 中的导航栏相关的问题,本质上,我是在调用 <ui-view></ui-view>
& <ion-nav-view></ion-nav-view>
同一个页面,所以基本上加倍了我的观点,这反过来又调用了控制器两次。
我知道这也已经得到解答,但我想为完全相同的问题添加我的修复程序。
我的控制器也被调用了两次,但就我而言,我不得不注释掉各种文件中的 ng-controller
设置:
主要是我的config函数app.js
.config(function($stateProvider, $urlRouterProvider) {
$stateProvider
.state('splash', {
url: "/",
templateUrl: "app/splash/splash.html"
// controller: 'SplashCtrl'
})
因为我已经在标记中调用了它:
<ion-view view-title="TickerTags" ng-controller="SplashCtrl as splash">
<ion-content class="splash">
我的指令中的控制器键
angular
.module('tagsPanelDirective', [])
.controller('TagsPanelCtrl', TagsPanelCtrl)
.directive('tagsPanel', tagsPanel);
function tagsPanel() {
var directive = {
templateUrl: "app/tags/tagsPanel.html",
restrict: "E",
replace: true,
bindToController: true,
// controller: 'TagsPanelCtrl as tagsPanel',
link: link,
scope: false
};
return directive;
function link(scope, element, attrs) {}
}
同样,因为我已经从模板标记中调用了它:
<section class="tags-panel" ng-controller="TagsPanelCtrl as tagsPanel">
在我的 angular 项目中,用户接受 EULA 然后自动重定向到他们的仪表板,但是,在这个重定向中,DashboardController 似乎被调用了两次,DashboardController 在路由本身上被调用,我已经检查过是否在模板中不小心再次调用了它,但我没有。下面是我的路线和控制器。无论我是直接访问 URL 还是通过 EULA 控制器上的重定向访问似乎都没有关系,我得到了相同的结果。
路线
.config(function($httpProvider, $stateProvider, $urlRouterProvider) {
$httpProvider.interceptors.push('httpRequestInterceptor');
$urlRouterProvider.otherwise('/');
$stateProvider
.state('login', {
url: '/',
templateUrl: 'templates/login.html',
data: {
requireLogin: false
}
})
.state('eula', {
url: '/eula',
templateUrl: 'templates/eula.html',
data: {
requireLogin: true
}
})
.state('dashboard', {
url: '/groups',
templateUrl: 'templates/dashboard.html',
data: {
requireLogin: true
}
})
});
控制器:
App.controller('DashboardController', ['$scope', 'RequestService', '$state', '$rootScope', function($scope, RequestService, $state, $rootScope){
alert('test');
}]);
有什么想法吗?
根据评论添加了我的 HTML
index.html
<body ng-app="App">
<ion-nav-bar class="bar-positive nav-title-slide-ios7" align-title="center">
<ion-nav-back-button class="button-icon ion-arrow-left-c"></ion-nav-back-button>
</ion-nav-bar>
<ion-nav-view class="slide-left-right"></ion-nav-view>
<ui-view></ui-view>
</body>
dashboard.html
<div class="groups" ng-controller="DashboardController">
<ion-view title="App">
<ion-nav-buttons side="right">
<a ui-sref="groupcreate"><span class="icon ion-ios-plus-outline"></span></a>
</ion-nav-buttons>
<ion-content class="padding">
<div class="row">
<div class="col-50" ng-repeat="group in groups">
{{ group }} 1
</div>
</div>
</ion-content>
</ion-view>
</div>
如果您使用 ui-router
,则不必使用 ng-controller
。您已经在 dashboard.html 中使用了它,另一个是由 ui-router
生成的 - 这就是它被击中两次的原因。
好的,经过长时间的调试和检查,我发现这是一个与 ionic 中的导航栏相关的问题,本质上,我是在调用 <ui-view></ui-view>
& <ion-nav-view></ion-nav-view>
同一个页面,所以基本上加倍了我的观点,这反过来又调用了控制器两次。
我知道这也已经得到解答,但我想为完全相同的问题添加我的修复程序。
我的控制器也被调用了两次,但就我而言,我不得不注释掉各种文件中的 ng-controller
设置:
主要是我的config函数app.js
.config(function($stateProvider, $urlRouterProvider) {
$stateProvider
.state('splash', {
url: "/",
templateUrl: "app/splash/splash.html"
// controller: 'SplashCtrl'
})
因为我已经在标记中调用了它:
<ion-view view-title="TickerTags" ng-controller="SplashCtrl as splash">
<ion-content class="splash">
我的指令中的控制器键
angular
.module('tagsPanelDirective', [])
.controller('TagsPanelCtrl', TagsPanelCtrl)
.directive('tagsPanel', tagsPanel);
function tagsPanel() {
var directive = {
templateUrl: "app/tags/tagsPanel.html",
restrict: "E",
replace: true,
bindToController: true,
// controller: 'TagsPanelCtrl as tagsPanel',
link: link,
scope: false
};
return directive;
function link(scope, element, attrs) {}
}
同样,因为我已经从模板标记中调用了它:
<section class="tags-panel" ng-controller="TagsPanelCtrl as tagsPanel">