发表新帖
发表新帖

angularjs - using {{}} binding inside ng-src but ng-src doesn't load

后端 未结
关注
2 1439
佛祖请我去吃肉
佛祖请我去吃肉 2021-02-03 17:16

I have been trying to bind a value to the ng-src of an img HTML element to no avail.

HTML code:


                      

              相关标签:
2条回答
  • 不要未来只要你来
    2021-02-03 17:34

    Changing the ng-src value is actually very simple. Like this:

    <html ng-app>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.6/angular.min.js"></script>
</head>
<body>
<img ng-src="{{img_url}}">
<button ng-click="img_url = 'https://farm4.staticflickr.com/3261/2801924702_ffbdeda927_d.jpg'">Click</button>
</body>
</html>

    Here is a jsFiddle of a working example: http://jsfiddle.net/Hx7B9/2/

    0 讨论(0)
  • 无人共我
    2021-02-03 17:52

    We can use ng-src but when ng-src's value became null, '' or undefined, ng-src will not work. So just use ng-if for this case:

    http://jsfiddle.net/Hx7B9/299/

    <div ng-app>
    <div ng-controller="AppCtrl"> 
        <a href='#'><img ng-src="{{link}}" ng-if="!!link"/></a>
        <button ng-click="changeLink()">Change Image</button>
    </div>
</div>
    0 讨论(0)
 看不清?
提交回复
热议问题