Question

我想根据以下代码显示图片：

app.controller('PostingCtrl', ['$scope','$http', '$q', function($scope, $http, $q) {

// Set of Photos
$scope.pictures = [
    {src: 'images/sample1.jpg', desc: 'Sample Image 01'},
    {src: 'images/sample2.jpg', desc: 'Sample Image 02'},
    {src: 'images/sample3.jpg', desc: 'Sample Image 03'}
];

// initial image index
$scope._Index = 0;

// if a current image is the same as requested image
$scope.isActive = function (index) {
    return $scope._Index === index;
};

// show a certain image
$scope.showPhoto = function (index) {
    $scope._Index = index;
};    

$scope.onCameraUpload = function() {
    navigator.camera.getPicture(
        function(imageInfo) {
            var image = {src: imageInfo, desc: 'none'};
            $scope.pictures.push.apply($scope.pictures, image);
        },
        function(message) {
            alert('Failed because: ' + message);
        },
        {
            quality: 50,
            sourceType : Camera.PictureSourceType.CAMERA
        }
    );
};
}]);

默认图片加载良好。但是，我想根据代码中给出的相机上传图像将另一个图像添加到列表中，然后自动将其刷新到页面。

我在代码中尝试过，但它没有用。请帮忙。

编辑：

这是html代码

            <section style="padding: 0 8px">
            <!-- slider container -->
            <div class="container slider">
                <!-- enumerate all photos -->
                <img ng-repeat="picture in pictures" class="slide" ng-swipe-right="showPrev()" ng-swipe-left="showNext()" ng-show="isActive($index)" ng-src="{{picture.src}}" />        
                <!-- extra navigation controls -->
                <ul class="nav">
                    <li ng-repeat="picture in pictures" ng-class="{'active':isActive($index)}">
                        <img src="{{picture.src}}" alt="{{picture.desc}}" title="{{picture.desc}}" ng-click="showPhoto($index);" />
                    </li>
                </ul>        
            </div>
        </section>

        <section style="padding: 0 8px 8px">
            <ons-button modifier="normal" ng-click="onCameraUpload()" style="float: right; width: 48.5%;">
                <ons-icon icon="camera"></ons-icon> Camera Upload
            </ons-button>
        </section>

Answer 1

我认为您需要更换推送命令：

＆＃13;

$scope.pictures.push(image);

＆＃13;

如果这不起作用，请粘贴您的HTML代码taht正在进行循环。如果你以一种方式绑定它（使用：:)

，这可能就是从那一点来的

编辑：

以下是我如何从Cordova获取照片，我的查询与您的有点不同...请验证您的

＆＃13;

var options = {
	quality: 50,
	destinationType: Camera.DestinationType.NATIVE_URL,
	sourceType: Camera.PictureSourceType.CAMERA,
	allowEdit: false,
	encodingType: Camera.EncodingType.JPEG,
	targetWidth: 700,
	targetHeight: 700,
	popoverOptions: CameraPopoverOptions,
	saveToPhotoAlbum: false,
	correctOrientation: true
};

$cordovaCamera.getPicture(options).then(function(imageData) {
	d.resolve(imageData);
}, function(err) {
	d.reject(err);
});

＆＃13;

将新项添加到静态列表并以角js自动刷新

1 个答案: