Question

我对使用离子的angular-ui有问题。每次有人进入“uploadPicture”菜单时，我都会尝试使用相机，但是当第一次有人进入页面时，该功能才会被触发。

应触发的函数称为takePicture（）。如果您需要更多详细信息，请告诉我！

谢谢你。

菜单看起来像：

<ion-item nav-clear menu-close href="#/app/uploadPicture">
    Upload Picture
</ion-item>

stateProvider：

.state('app.uploadPicture', {
                url: "/uploadPicture",
                views: {
                    'menuContent': {
                        templateUrl: "templates/uploadPicture.html",
                        controller: 'uploadPictureCtrl'
                    }
                }
            })

和控制器：

            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');
                    });

                })
            }

Answer 1

        function takePicture () {
            pictureSource = navigator.camera.PictureSourceType.CAMERA;
            processPicture()
        }
        takePicture();

快速查看代码，在控制器实例化中调用takePicture（）函数。这意味着当你的应用程序启动时，AngularJS已经创建了控制器并调用了该函数。注释掉该行，您将看到问题停止。您需要找到一种在用户导航时调用takePicture函数的方法，而不是在实例化控制器时。

编辑：查看路由器的角度api，您可能对onExit和onEnter状态更改函数感兴趣：

https://github.com/angular-ui/ui-router/wiki

Answer 2

我得到了答案。它真的很脏，所以如果有人有更好的解决方案告诉我！基本上，想法是从控制器获取状态并附加onEnter功能。（感谢Peter）

感谢

 $state.get('app.uploadPicture').onEnter = function () {
                $scope.takePicture();
 };

angular-ui，控制器中的离子触发功能

2 个答案: