Question

嗨，伙计们！
我在Ionic Framework应用程序上工作。我想从图库中选择照片并在视图中预览它们。
问题是$ scope正在更新，但要显示新选择的图像，我需要在app中为动画制作动画，这对我来说很奇怪。

我创建了一个PoC here。

离子信息：

Silviu:~ silviu$ ionic info

Your system information:

Cordova CLI: 6.4.0
Ionic CLI Version: 2.1.18
Ionic App Lib Version: 2.1.9
ios-deploy version: 1.9.0
ios-sim version: 5.0.8
OS: macOS Sierra
Node Version: v7.4.0
Xcode version: Xcode 8.2.1 Build version 8C1002

在我看来，我有代码：

        <label class="item item-input item-stacked-label">
      <button class="button" ng-click="doGetImage()">Incarca imagini</button>
    </label>
    <ion-list>
      <ion-item ng-repeat="item in toBeUploaded">
        <img ng-src={{item.base_src}} class="image-list-thumb"/>
        {{item.file_name}}
        <a ng-click="deleteImage(item)">Sterge</a>
      </ion-item>
    </ion-list>

在我的控制器中，我有以下功能：



    $scope.toBeUploaded = [];
    $scope.doGetImage = function () {
    var options = {
      maximumImagesCount: 1, // only pick one image
      width: 800,
      height: 800,
      quality: 80
    };

    var fileName, path;

    var element = {};

    $cordovaImagePicker.getPictures(options)
      .then(function (results) {
        window.resolveLocalFileSystemURL(results[0], onResolveSuccess, fail);

        function onResolveSuccess(fileEntry) {
          // convert to Base64 string
          fileEntry.file(
            function (file) {
              //got file
              var reader = new FileReader();
              reader.onloadend = function (evt) {
                element.base_src = evt.target.result;
              };
              reader.readAsDataURL(file);

            },
            function (evt) {
              //failed to get file
            });

        }
        // error callback
        function fail(fct) {
          console.log("Error");
        }

        // lets read the image into an array buffer..
        // see documentation:
        // http://ngcordova.com/docs/plugins/file/
        fileName = results[0].replace(/^.*[\\\/]/, '');
        // modify the image path when on Android
        if ($ionicPlatform.is("android")) {
          path = cordova.file.cacheDirectory
        } else {
          path = cordova.file.tempDirectory
        }
        element.file_name = fileName;
        element.path = path;
        $scope.toBeUploaded.push(element);
      });
      }

Answer 1

我使用resolveLocalFileSystemURL的承诺解决了这个问题。 https://stackoverflow.com/a/39315100/5389833

没有事件，离子视图不会更新$ scope更改

1 个答案: