Angular/Ionic 代码调用函数尚未加载
Angular/Ionic code calling functions not yet loaded
我花了很长时间才弄清楚发生了什么。一个标准的 $ionicPopover 被调用,我得到一个
Cannot read property 'show' of undefined
一旦输入控制器,它就会检查 $stateParm
- 如果已设置,则启动弹出窗口。但问题是 $ionicPopover 模板尚未加载到 $scope 中,因此 $scope.popover.show()
返回错误。
当我添加一个 setTimeout(function() { $scope.popover.show(); },2000) ;
时 - 这会延迟足够长的时间,以便将弹出窗口加载到范围中并允许它启动。
虽然这个创可贴有用,但我不喜欢用这个方法。我可以使用什么其他方法来确保 $ionicPopover/$ionicModal 都已加载其他代码允许执行和引用它们?
$ionicPopover.fromTemplateUrl('pushPopover.html', {
scope: $scope,
focusFirstInput:false
}).then(function(popover) {
$scope.popover = popover;
});
$scope.openPopover = function() {
$scope.popover.show(); // calls before popover is loaded causing error
}
$scope.closePopover = function() {
$scope.popover.hide();
}
if ($stateParams.pushAction == 1) {
$scope.pushSub = $stateParams.pushSub ;
$scope.pushMsg = $stateParams.pushMsg ;
$scope.pushCode = $stateParams.pushCode ;
$scope.openPopover() ;
}
为了让它工作,我不得不故意用草率的超时延迟调用:
if ($stateParams.pushAction == 1) {
$scope.pushSub = $stateParams.pushSub ;
$scope.pushMsg = $stateParams.pushMsg ;
$scope.pushCode = $stateParams.pushCode ;
setTimeout(function() {
$scope.openPopover() ;
},2000) ;
}
一种技术是存储承诺并从中链接:
var popoverPromise = $ionicPopover.fromTemplateUrl(
'pushPopover.html',
{
scope: $scope,
focusFirstInput:false
});
popoverPromise.then(function(popover) {
$scope.popover = popover;
});
$scope.openPopover = function() {
̶$̶s̶c̶o̶p̶e̶.̶p̶o̶p̶o̶v̶e̶r̶.̶s̶h̶o̶w̶(̶)̶;̶ ̶ ̶/̶/̶ ̶c̶a̶l̶l̶s̶ ̶b̶e̶f̶o̶r̶e̶ ̶p̶o̶p̶o̶v̶e̶r̶ ̶i̶s̶ ̶l̶o̶a̶d̶e̶d̶ ̶c̶a̶u̶s̶i̶n̶g̶ ̶e̶r̶r̶o̶r̶
popoverPromise.then(function(popover) (
popover.show(); //called after popover loaded
});
};
$scope.closePopover = function() {
̶$̶s̶c̶o̶p̶e̶.̶p̶o̶p̶o̶v̶e̶r̶.̶s̶h̶o̶w̶(̶)̶;̶
popoverPromise.then(function(popover) {
popover.hide();
});
};
服务立即return承诺,而.then
阻塞等待来自服务器的数据。
我花了很长时间才弄清楚发生了什么。一个标准的 $ionicPopover 被调用,我得到一个
Cannot read property 'show' of undefined
一旦输入控制器,它就会检查 $stateParm
- 如果已设置,则启动弹出窗口。但问题是 $ionicPopover 模板尚未加载到 $scope 中,因此 $scope.popover.show()
返回错误。
当我添加一个 setTimeout(function() { $scope.popover.show(); },2000) ;
时 - 这会延迟足够长的时间,以便将弹出窗口加载到范围中并允许它启动。
虽然这个创可贴有用,但我不喜欢用这个方法。我可以使用什么其他方法来确保 $ionicPopover/$ionicModal 都已加载其他代码允许执行和引用它们?
$ionicPopover.fromTemplateUrl('pushPopover.html', {
scope: $scope,
focusFirstInput:false
}).then(function(popover) {
$scope.popover = popover;
});
$scope.openPopover = function() {
$scope.popover.show(); // calls before popover is loaded causing error
}
$scope.closePopover = function() {
$scope.popover.hide();
}
if ($stateParams.pushAction == 1) {
$scope.pushSub = $stateParams.pushSub ;
$scope.pushMsg = $stateParams.pushMsg ;
$scope.pushCode = $stateParams.pushCode ;
$scope.openPopover() ;
}
为了让它工作,我不得不故意用草率的超时延迟调用:
if ($stateParams.pushAction == 1) {
$scope.pushSub = $stateParams.pushSub ;
$scope.pushMsg = $stateParams.pushMsg ;
$scope.pushCode = $stateParams.pushCode ;
setTimeout(function() {
$scope.openPopover() ;
},2000) ;
}
一种技术是存储承诺并从中链接:
var popoverPromise = $ionicPopover.fromTemplateUrl(
'pushPopover.html',
{
scope: $scope,
focusFirstInput:false
});
popoverPromise.then(function(popover) {
$scope.popover = popover;
});
$scope.openPopover = function() {
̶$̶s̶c̶o̶p̶e̶.̶p̶o̶p̶o̶v̶e̶r̶.̶s̶h̶o̶w̶(̶)̶;̶ ̶ ̶/̶/̶ ̶c̶a̶l̶l̶s̶ ̶b̶e̶f̶o̶r̶e̶ ̶p̶o̶p̶o̶v̶e̶r̶ ̶i̶s̶ ̶l̶o̶a̶d̶e̶d̶ ̶c̶a̶u̶s̶i̶n̶g̶ ̶e̶r̶r̶o̶r̶
popoverPromise.then(function(popover) (
popover.show(); //called after popover loaded
});
};
$scope.closePopover = function() {
̶$̶s̶c̶o̶p̶e̶.̶p̶o̶p̶o̶v̶e̶r̶.̶s̶h̶o̶w̶(̶)̶;̶
popoverPromise.then(function(popover) {
popover.hide();
});
};
服务立即return承诺,而.then
阻塞等待来自服务器的数据。