从JSON数据得到IMG SRC同时使用AngularJS NG绑定，HTML [英] getting img src from json data while using AngularJS ng-bind-html

问题描述

所以我有一个有趣的问题，我还没有找到答案。

So I got a interesting question to which I haven't found a answer to.

比方说，我有一组数据从JSON文件一样来的，但不知何故的主要领域之一，看起来像这样

Let's say I got a bunch of data coming from a JSON file like, but somehow one of the main fields looks like this

description : '<img src="http://o.aolcdn.com/hss/storage/midas/37c38989a5f26031be3e0ec5ffc5cd2/200012386/got-hbo-go-crash-2014-04-07-01_thumbnail.jpg"/> Viewing of the Game of Thrones season debut came to a crashing halt yesterday thanks to server problems with HBO Go. The cable outfit first reported the problem late yesterday via Twitter, and finally restored full service early this morning. That...'

我如何将能够从IMG获得SRC同时采用NG-绑定-HTML的JSON数据的innerHTML绑定我的网页上。 （使用显示：无;在IMG本身，因此would'nt显示）

How would I be able to get the src from that IMG while using ng-bind-html to bind the json data to the innerHTML on my page. ( using display:none; on the img itself so it would'nt display )

我曾尝试getElementsByTags等，但没有返回一个有效的值。

I have tried getElementsByTags and so on, but nothing returned a valid value.

是否有某种角的方式做到这一点还是...？

Is there some kind of "angular" way to do it or... ?

BR的

推荐答案

根据存储在你能做到这一点的对象中的HTML：

Based on the html stored in the object you could do this:

var json = {description : '<img src="http://o.aolcdn.com/hss/storage/midas/37c38989a5f26031be3e0ec5ffc5cd2/200012386/got-hbo-go-crash-2014-04-07-01_thumbnail.jpg"/> Viewing of the Game of Thrones season debut came to a crashing halt yesterday thanks to server problems with HBO Go. The cable outfit first reported the problem late yesterday via Twitter, and finally restored full service early this morning. That...'};

  $scope.imgPath = '';

  $scope.getImage = function() {
    el = angular.element(angular.element('<div>' + json.description + '</div>').find('img')[0]);
    $scope.imgPath = el.attr('src');

  }

下面是一个演示： http://plnkr.co/edit/JXy97lrN5FyW1MK33qO1？ p = preVIEW

此解决方案假定的jQuery不包含在该项目中。

This solution assumes jQuery isn't included in the project.

这也可以工作：

 $scope.imgPath = angular.element(json.description).attr('src');

演示： http://plnkr.co/edit/zVllp9bmsU2DoZwDZnCY?p=info

这篇关于从JSON数据得到IMG SRC同时使用AngularJS NG绑定，HTML的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！