Question

当我在Angular JS中选择文件<input type="file">后点击添加按钮时，如何使用ng-repeat逐个选择图像到div标签。我试过下面的代码：

<body ng-app="myApp">

<div ng-controller="mainController">
    <div>
        <h3>Added Images: {{addedImages()}}</h3>
    </div>

    <div>
        <input type="file" id="filename" ng-model="filename" name="">
        <button ng-click="test()">Add Image</button>
        <div class="shelfgallery"></div>
    </div>        
</div>

<script>
    var app = angular.module('myApp', []);
    app.controller('mainController', function($scope) {
        $scope.imageSources=[];

        $scope.test = function(){
            var url = ""//facing trouble in getting full URL of choosen image 
            alert(url);
            $scope.imageSources.push({
                imges: $scope.filename
            });
            var element = angular.element($('.shelfgallery'));
            element.append('<img id="img_11" ng-repeat="imageSource in imageSources track by $index" ng-src="{{imageSource }}" /><br><br>');
            //$compile(element)($scope);
        };

        $scope.addedImages = function(){
            return $scope.imageSources.length;
        }

    });
</script>

</body>

如果有任何错误，请告诉我，或任何其他解决方案。

将所选图像附加到div标签并在onclick按钮上使用ng-repeat逐个显示Angular JS

0 个答案: