用于img src或其他选择器的AngularJS正则表达式json数据

时间:2014-11-16 21:34:18

标签: javascript json angularjs

我是棱角分明的新人,所以请在这里忍受....我有一个简单但又脏的json结果文件,我正在拉入我的angularjs页面。我试图从返回的信息中找到的第一个img中获取img src。这是一个小提琴设置:

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

app.controller('MainCtrl', function ($scope) {
    $scope.data = "HEREHLKSDJFKLFJSLK:FJKFJ:KLJSL:KDfj<img src=\"http://www.sierraavalanchecenter.org/sites/default/files/forecast/201411/20141113-074138-0.png\"/ >asdfsdjflksdfj;kasdfkjs;dklfs;df";
});

app.filter('extractSrcUrl', function () {
    return function (text) {
        var output = angular.element(text).attr('src');
        return(output);
    }
});

http://jsfiddle.net/j9jst560/

如果通过以下帖子找到了过滤器的想法:getting img src from json data while using AngularJS ng-bind-html

如果我删除所有json数据并离开:http://www.sierraavalanchecenter.org/sites/default/files/forecast/201411/20141113-074138-0.png\"/&gt;过滤器拉出src很好。

然而,由于我的数据混乱,没有结果。我应该在我的控制器中的某个地方使用正则表达式而不是运行过滤器吗?我的数据不好吗?

1 个答案:

答案 0 :(得分:1)

您可以执行以下任一操作。

将您的选择器代码修改为以下内容:

var output = angular.element('<div>' + text + '</div>').find('img')[0].attr('src')

这可能是最安全,最简单的方法。请注意,在角度1.2及以下(我相信它们将其固定在1.3中),这必须如下:

var output = angular.element(angular.element('<div>' + text + '</div>').find('img')[0]).attr('src')

另一种方法是纯粹使用正则表达式提取如下:

var output = text.match(/src="([^"]*)"/i)[1]

作为旁注 - return不是函数,通常只调用return output;