angular.js - controller层的方法读取到的数组赋值给$scope下的对象,该对象绑定到了页面上,为什么页面上看不到数组中的内容
PHP中文网
PHP中文网 2017-05-15 16:57:30
0
2
638

appCtrls.controller('uploadFileCtrl', function ($scope, $state, $cordovaImagePicker, localStorageService) {

$scope.initPage = function () {
    $scope.folderName=""
    $scope.fileList = [];
}
$scope.chooseFile = function () {
    var options = {
        maximumImagesCount: 9,
        width: 800,
        height: 800,
        quality: 80
    };
    $cordovaImagePicker.getPictures(options).then(function (results) {
        $scope.fileList=results;
        console.log("fileList:"+$scope.fileList);
    }, function (error) {
        // error getting photos
    });
}

})

//页面
<form name="fileForm" novalidate>
<ion-view>

<ion-nav-buttons side="left">
    <a class="button button-clear" ui-sref="tab.more-userInfo"><i class="icon ion-ios-arrow-left"></i></a>
</ion-nav-buttons>
<ion-nav-buttons side="right">
    <a class="button button-clear" ng-click="uploadFiles()">发送</a>
</ion-nav-buttons>
<ion-content ng-init="initPage()">
    <script id="templates/form-errors.html" type="text/ng-template">
        <p class="form-error" ng-message="ng-maxlength">请输入最多20个字符</p>
        <p class="form-error" ng-message="ng-minlength">请输入至少1个字符</p>
    </script>

    <p class="item item-input" ng-class="{'has-error':fileForm.folderName.$invalid}">
        <textarea style="height: 100px" ng-model="folderName" name="folderName" type="text" placeholder="请输入文档名称" ng-maxlength="20" ng-minlength="1">
        </textarea>
    </p>
    <p ng-show="fileForm.folderName.$invalid" class="form-errors"
         ng-messages="fileForm.folderName.$error"
         ng-messages-include="templates/form-errors.html">
    </p>
    <p class="item item-icon-left">
        <i ng-click="chooseFile()" class="icon ion-image" style="width: 30px;height:26px"></i>
    </p>
    <p class="row">
        <p class="item-avatar" ng-repeat="file in fileList">
            <img ng-src="{{file}}">
        </p>
    </p>
</ion-content>

</ion-view>
</form>
getPictures方法返回一个字符串数组,该字符串数组每一个元素都是一个文件路径,然后将图片显示到页面上,可是结果是什么也看不到,这是怎么回事呢

PHP中文网
PHP中文网

认证0级讲师

membalas semua(2)
大家讲道理

Sila tambah $scope.$digest();

di bawah $scope.fileList=results;

Dalam keadaan biasa, fungsi acara seperti ng-click akan secara automatik mengesan sama ada skop telah berubah selepas pelaksanaan dan kemudian menggunakan perubahan tersebut. Tetapi anda menggunakan Janji di sini untuk melaksanakan operasi tak segerak, dan fungsi dalam then() akan dilaksanakan selepas operasi tak segerak selesai. Pada masa ini, chooseFile telah dilaksanakan dan pengubahsuaian tidak akan dikesan secara automatik melainkan anda memanggil digest.

Ringkasnya, terdapat banyak pengecualian untuk pengesanan automatik Angular terhadap pengubahsuaian, seperti operasi tak segerak, acara pihak ketiga, pengubahsuaian pada pengawal lain, dll., jadi berhati-hati untuk menambah $scope.$digest();

左手右手慢动作
  1. Arahan tersuai dalam templat boleh digunakan seperti biasa.

  2. Pengawal berjaya didaftarkan dalam templat.
    Jika dua item di atas adalah benar, maka seperti yang dinyatakan di atas, fungsi panggil balik tidak berjaya dikembalikan sebelum pemaparan templat selesai, jadi data yang dikembalikan tidak boleh diperolehi.

Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan