angular.js - controller层的方法读取到的数组赋值给$scope下的对象，该对象绑定到了页面上，为什么页面上看不到数组中的内容

Question

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方法返回一个字符串数组，该字符串数组每一个元素都是一个文件路径，然后将图片显示到页面上，可是结果是什么也看不到，这是怎么回事呢

Answer 1

$scope.fileList=results; 아래에 $scope.$digest();

를 추가해주세요.

일반적으로 실행 후 ng-click과 같은 이벤트 기능은 범위가 변경되었는지 자동으로 감지한 다음 변경 사항을 적용합니다. 하지만 여기에서는 Promise를 사용하여 비동기 작업을 수행했으며, then()의 함수는 비동기 작업이 완료된 후에 실행됩니다. 이때 chooseFile이 실행되었으며, 다이제스트를 호출하지 않으면 수정 사항이 자동으로 감지되지 않습니다.

간단히 말하면 Angular가 비동기 작업, 타사 이벤트, 다른 컨트롤러 수정 등 수정 사항을 자동으로 감지하는 경우 많은 예외가 있으므로 주의해서 $scope.$digest();를 추가하세요.

Answer 2

1. 템플릿의 사용자 정의 지침을 정상적으로 사용할 수 있습니다.

2. 컨트롤러가 템플릿에 성공적으로 등록되었습니다.
   위 두 항목이 true인 경우 위에서 언급한 것처럼 템플릿 렌더링이 완료되기 전에 콜백 함수가 성공적으로 반환되지 않으므로 반환된 데이터를 가져올 수 없습니다.