I have a problem with angular-ui using ionic. I am trying to lauch the camera every time someone go to the menu "uploadPicture", but the function just get triggered the first time someone go to the page.
The function that should be trigger is called takePicture(). If you need more details, tell me !
Thanks you.
The Menu look like :
<ion-item nav-clear menu-close href="#/app/uploadPicture">
Upload Picture
</ion-item>
The stateProvider:
.state('app.uploadPicture', {
url: "/uploadPicture",
views: {
'menuContent': {
templateUrl: "templates/uploadPicture.html",
controller: 'uploadPictureCtrl'
}
}
})
and the controller:
function takePicture () {
pictureSource = navigator.camera.PictureSourceType.CAMERA;
processPicture()
}
takePicture();
function processPicture() {
$scope.canUpload = true;
var options = {
quality: 50,
destinationType: Camera.DestinationType.DATA_URL,
sourceType: pictureSource,
encodingType: Camera.EncodingType.JPEG,
targetWidth: 640
};
navigator.camera.getPicture(
function (image64) {
$scope.mypicture = image64;
},
function (err) {
$state.go('app.vote');
setTimeout(function () {
console.log(err);
}, 0);
},
options);
}
$scope.upload = function () {
$scope.uploading = true;
var picture = {};
picture.name = $scope.obj.name;
picture.base64 = 'data:image/jpeg;base64,' + $scope.mypicture;
picture.location = $scope.myLocation;
Picture.uploadPicture({picture: picture, uuid: device.uuid}, function (reply) {
var alertPopup = $ionicPopup.alert({
title: 'Picture successfully uploaded'
});
alertPopup.then(function (res) {
$scope.uploading = false;
$state.go('app.trendingMenu');
});
})
}
function takePicture () {
pictureSource = navigator.camera.PictureSourceType.CAMERA;
processPicture()
}
takePicture();
Having a quick look at your code, you call the takePicture() function in the instantiation of your controller. That means when your app starts AngularJS has already created the controller and called that function. Comment the line out, and you will see your problem stop. You need to find a way to call the takePicture function when the user navigates, not when the controller is instantiated.
EDIT: looking at the angular api for router, you are probably interested in onExit and onEnter functions of state changes:
I got an answer. It's really dirty, so if someone have a better solution tell me ! Basicaly the idea is to get the state from the controller and attach the onEnter function.(thanks Peter)
thanks
$state.get('app.uploadPicture').onEnter = function () {
$scope.takePicture();
};