Javascript 从$http响应解析HTML丢失href属性_Javascript_Html_Angularjs_Parsing

Javascript 从$http响应解析HTML丢失href属性

javascript html angularjs parsing

Javascript 从$http响应解析HTML丢失href属性,javascript,html,angularjs,parsing,Javascript,Html,Angularjs,Parsing,解析$http.get（）的HTML响应时遇到问题我可以获取原始HTML响应并将其作为字符串输出到控制台： '<html><head><title>portal</title></head><body><H1>portal</H1><hr><pre><A HREF="/WebPortal/">To Parent Directory</A><br&

解析

$http.get（）

的HTML响应时遇到问题

我可以获取原始HTML响应并将其作为字符串输出到控制台：

'<html><head><title>portal</title></head><body><H1>portal</H1><hr><pre><A HREF="/WebPortal/">To Parent Directory</A><br><br><A HREF="/WebPortalPI/Brochures/White/">White stuff</A><br><A HREF="/WebPortalPI/Brochures/Green/">Green things</A><br><A HREF="/WebPortalPI/Brochures/Yellow/">Yellow wigits</A><br><A HREF="/WebPortalPI/Brochures/Blue/">Blue Misc</A><br></pre><hr></body></html>'

Javascript:

var myApp=angular.module（'myApp'，[]）；
控制器（'MyCtrl'，['$scope'，'$http'，函数（$scope，$http）{
$scope.data=[]；
$http.get（'/my api call'）.success（函数（数据、状态、标题、配置）{
//这是响应中返回的数据，而不是发布我的实际api链接（尚未公开）
var str='portalportal









'；
var parser=新的DOMParser（）；
var doc=parser.parseFromString（str，'text/html'）；
$scope.data=doc.firstChild.querySelectorAll（'pre a'）；
}).error（函数（数据、状态、标题、配置）{
//处理$http错误
});
}]);

DOMParser无法解析URL，因为它是相对的，并且DOMParser没有根目录。如果URL是绝对的，它将工作。不幸的是，我没有任何能力修改原始HTML中的链接。有没有一种方法可以为DOMParser提供一个开始的上下文？您可以尝试将

base

标记注入字符串的头部分。或者干脆

str=''+str。但这是一种黑客行为。我认为没有办法将根URL传递到DOMParser，但您可以始终使用string.replace->或使用实现.createHTMLDocument->的旧方式
<div ng-controller="MyCtrl">
  <div ng-repeat="link in data">
    <a href="{{link.href}}">{{link.text}}</a>
</div>

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

myApp.controller('MyCtrl', ['$scope', '$http', function ($scope, $http) {
    $scope.data = [];

    $http.get('/my-api-call').success(function (data, status, headers, config) {

      //rather than posting my actual api link (not public yet) this is the data that is returned in the response
      var str = '<html><head><title>portal</title></head><body><H1>portal</H1><hr><pre><A HREF="/WebPortal/">To Parent Directory</A><br><br><A HREF="/WebPortalPI/Brochures/White/">White stuff</A><br><A HREF="/WebPortalPI/Brochures/Green/">Green things</A><br><A HREF="/WebPortalPI/Brochures/Yellow/">Yellow wigits</A><br><A HREF="/WebPortalPI/Brochures/Blue/">Blue Misc</A><br></pre><hr></body></html>';

      var parser = new DOMParser();

      var doc = parser.parseFromString(str, 'text/html');

      $scope.data = doc.firstChild.querySelectorAll('pre a');

    }).error(function (data, status, headers, config) {
      //handle $http error
    });

}]);