AngularJS img ng-src binding doesn't work

问题

I'm trying to bind the ng-src of a img with a $scope variable but it doesn't refresh the image when the variable changes.

THE HTML

<body ng-app="CameraApp" ng-controller="cameraController">
<br/><br/>
<div align="center">
    <img id="myImage" ng-src="{{ imageSrc }}" ng-click="TakePicture();"/><br/><br/>
    <input type="button" ng-click="TakePicture();" value="TAKE PICTURE" /><br/><br/>
    <input type="button" ng-disabled="{{ savePict }}" value="SAVE PICTURE"/>
</div>

THE JS

var app = angular.module('CameraApp', ['ngTouch']);

app.controller('cameraController', function ($scope) {

$scope.savePict = true;
$scope.imageSrc = '';


$scope.TakePicture = function () {
    navigator.camera.getPicture(onSuccess, onFail, {
        quality: 50,
        destinationType: Camera.DestinationType.FILE_URI
    });
}

function onSuccess(imageUri) {
    $scope.imageSrc = imageUri;
}

function onFail(message) {
    alert('Failed because: ' + message);
    document.getElementById("myImage").src = "";
    $scope.savePict = true;
  } 
});

回答1:

solved this way

function onSuccess(imageUri) {
    $scope.$apply(function () {
        $scope.imageSrc = imageUri;
    })
}

来源：https://stackoverflow.com/questions/53005269/angularjs-img-ng-src-binding-doesnt-work

标签

angularjs

易学教程内所有资源均来自网络或用户发布的内容，如有违反法律规定的内容欢迎反馈！
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!