如何使用离子和角度在模态内显示选定的图像名称

how to show selected image names inside modal using ionic and angular?

本文关键字：显示 图像 模态 何使用      更新时间：2023-09-26

>我使用了一个cordova插件从ios库中选择图像并显示图像。我在这里面临的问题是，我想要一个应该显示所选图像名称的模态，但我无法显示此模态。这是我的代码：

我的控制器： 

app.controller('ImagePickerController', function($scope, $rootScope,$cordovaImagePicker, $ionicPlatform, $cordovaContacts,$ionicModal) {
    $scope.ready = false;
    $scope.images = [];
    $scope.openGallery = function() {
        alert("hii");
        var options = {
                maximumImagesCount: 20, // Max number of selected images, I'm using only one for this example
                width: 800,
                height: 800,
                quality: 100            // Higher is better
        };
        $cordovaImagePicker.getPictures(options).then(function(results) {
            for(var i=0 ; i<results.length ; i++){
                //alert(results[i]);
                //console.log('img', imageUri);
                $scope.images.push(results[i]);
                var imagename = results[i];
                $scope.truncatedimgname = imagename.replace(/^.*['''/]/, '')
                alert(truncatedimgname);
            }
        }, function(err) {
        // error
        });
        openModal();
    };
$scope.openModal = function(animation) {
    alert("modal");
    $ionicModal.fromTemplateUrl('contact-modal.html', {
      scope: $scope,
      animation: 'slide-in-up'
    }).then(function(modal) {
      $scope.modal = modal;
      $scope.modal.show();
    });
  };
  $scope.closeModal = function() {
    $scope.modal.hide();
  };
});
我已经截断

了图像的名称，并在截断的imgname中截断了扩展名。我希望当用户在选择图像后单击完成按钮并在该模态内显示他们的名字时显示我的模态。

您必须在

成功函数中调用$scope.openModal()。事实上，results 仅在此函数中可用，并且异步可用（在用户选择后），因为$cordovaImagePicker.getPictures(options)返回一个 promise。

$cordovaImagePicker.getPictures(options)
    .then(function (results) {
      // on success
      ...
      openModal();
    }, function(error) {
      // on error
      ...
    });

在你发布的代码中，你已经将函数定义为$scope.openModal但是在调用函数时，你只放置了openModal()，它不会找到附加到$scope变量的函数。

您应该调用该函数，$scope.openModal();

相关文章：