VLR
VLR

Reputation: 312

Displaying Image in Angular

and I want to display an image im my <img src> when I clicked the button select image it displays all the information of the image but it doesn't show any img at all. I call the information of the image in my app.js using .directive

.directive("filesInput", function() {

    return {
        require: "ngModel",
        link: function postLink($scope, elem, attrs, ngModel) {
            elem.on("change", function(e) {

                var files = elem[0].files;
                ngModel.$setViewValue(files);
                // var imageData = _.map(files, 'name');
                $scope.img = files;
                console.log(files);


            })
        }
    }
});

How can I call the .directive("filesInput") to my controller to display in my .html

<img src="{{files}}">

Upvotes: 1

Views: 863

Answers (1)

Robert Anderson
Robert Anderson

Reputation: 1256

Looks like the problem is in the directive, where it is setting the image. So it sets the scope img but not the variable. The img would need the full path e.g.

<img ng-src="{{img}}">

or depending on the location you would need to prepend the image path before it such as

<img ng-src="'/pathofimage/' + {{img}}">

Upvotes: 2

Related Questions