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

Question

我是 Angular 新手，所以请耐心等待......我有一个简单但肮脏的 json 结果文件，我正在将其拉入我的 angularjs 页面。我试图从返回的信息中找到的第一个 img 中获取 img src。这是一个关于它的设置的 fiddle :

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\"/> 过滤器将拉出输出 src 就可以了。

但是，我的数据很乱，没有结果。我应该在 Controller 中的某个位置使用正则表达式而不是运行过滤器吗？我的数据有那么糟糕吗？

Answer 1

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

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

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

这可能是最安全、最简单的方法。请注意，在 Angular 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;。