Angular: Empty Fiddle

http://angularjs.org/

HTML

<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-controller="MyCtrl">

    <div ng-repeat="step in stepsModel">
        <img class="thumb" ng-src="{{step}}" />
    </div>
    
    <input type='file' ng-model-instant onchange="angular.element(this).scope().imageUpload(this)" />

</div>

CSS

.thumb{
    width:100px;
    height:100px;
    margin:5px;
    float:left;
}

.uploader{
    clear:both;
}

JavaScript

var myApp = angular.module('myApp',[]);


function MyCtrl($scope) {
    $scope.stepsModel = [];

    $scope.imageUpload = function(element){
        var reader = new FileReader();
        reader.onload = $scope.imageIsLoaded;
        reader.readAsDataURL(element.files[0]);
    }

    $scope.imageIsLoaded = function(e){
        $scope.$apply(function() {
            $scope.stepsModel.push(e.target.result);
        });
    }
}