文章/答案/技术大牛

发布

社区首页 >问答首页 >用angular正则表达式替换href

问用angular正则表达式替换href
EN

Stack Overflow用户

提问于 2016-08-07 02:14:40

回答 2查看 1.2K关注 0票数 2

我正在寻找一个过滤器来替换API的TextEntity中的"href“。"text“可以包含3种不同类型的URL。在替换之后，我想在一个新的单独窗口中打开更正后的URL。

我从textvalue接收到以下信息：

1. <a href="http://someurl.tdl">link</a> - this is an example for a all kind of external links. Can be mysite.com/mypage.html or any other valid url. Like everything with a http://, https://, ftp:// in the startof the url.
2. <a href="singpage.html">internal page</a> - Can includes all other files. like mypdf.pdf or mydoc.doc or other stuff, but without http://mydomain.tdl
3. <a href="mailto: mymail@domain.tdl">mymail@domain.tdl</a>

我试过了，但是不起作用。

.filter('parseText', function ($sce, $sanitize) {
var mydomain = 'http://www.mydomain.tdl';
return function (text) {
    var newStringUrlReplace = $sanitize(text).replace('href="','href="'+mydomain);
    var regex = /href="([\S]+)"/g;
    var newString = newStringUrlReplace.replace(regex, "class=\"externalURL\" onClick=\"cordova.InAppBrowser.open('$1', '_blank', 'location=yes')\"");
    return $sce.trustAsHtml(newString);
    }
});

我需要这个"text“运行的输出通过过滤器：

1. <a href="http://someurl.tdl" class="externalURL" onClick="cordova.InAppBrowser.open('http://someurl.tdl', '_blank', 'location=yes')">link</a>
2. <a href="http://www.mydomain.tdl/singpage.html" onClick="cordova.InAppBrowser.open('http://www.mydomain.tdl/singpage.html', '_blank', 'location=yes')">internal page</a>
3. <a href="mailto: mymail@domain.tdl">mymail@domain.tdl</a>

为了更容易理解，请执行以下操作：

我需要一个函数，把这种类型的网址。

<a href="http://someurl.tdl/whichcanincludeanything.html?bar=foo">URL TO A  EXTERNAL PAGE</a>

<a href="singpage.html">internal page of the CMS</a>

转到

<a href="http://someurl.tdl/whichcanincludeanything.html?bar=foo" class="externalURL" onClick="cordova.InAppBrowser.open('http://someurl.tdl/whichcanincludeanything.html?bar=foo', '_blank', 'location=yes')">URL TO A  EXTERNAL PAGE</a>

<a href="http://www.mydomain.tdl/singpage.html" onClick="cordova.InAppBrowser.open('http://www.mydomain.tdl/singpage.html', '_blank', 'location=yes')">internal page</a>

javascript

angularjs

json

regex

ionic-framework

回答 2

Stack Overflow用户

发布于 2016-08-07 06:15:37

这是一个基于您的原始code的版本

(function() {
  angular
    .module('app', ['ngSanitize'])
    .controller('MainCtrl', MainCtrl)
    .filter('parseText', parseText);

  function MainCtrl($scope) {
    $scope.array = [
      '<a href="http://someurl.tdl">link</a>',
      '<a href="singpage.html">internal page</a>',
      '<a href="mailto: mymail@domain.tdl">mymail@domain.tdl</a>',
      '<a href="http://someurl.tdl/whichcanincludeanything.html?bar=foo">URL TO A  EXTERNAL PAGE</a>',
      '<a href="singpage.html">internal page of the CMS</a>'
    ];
  }

  function parseText($sce) {
    var myDomain = 'http://www.mydomain.tdl/';
    var externalRegex = /([http|https|ftp]+:\/\/[^"]*)/g;
    var internalRegex = /(href=)"([^"]*)/g;
    return function(input) {
      if (!input) return;
      if (input.indexOf('mailto: ') !== -1) return input;
      var url = '';
      if (externalRegex.test(input)) {
        url = input.replace(externalRegex, '$1" class="externalURL" onClick="cordova.InAppBrowser.open(\'$1\', \'_blank\', \'location=yes\')');
      } else {
        url = input.replace(internalRegex, '$1 ' + myDomain + '$2' + ' class="externalURL" onClick="cordova.InAppBrowser.open(\'' + myDomain + '$2' + '\', \'_blank\', \'location=yes\')');
      }
      return $sce.trustAsHtml(url);
    }
  }
})();

<!DOCTYPE html>
<html ng-app="app" >

<head>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.8/angular.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.8/angular-sanitize.min.js"></script>
</head>

<body ng-controller="MainCtrl">
  <p ng-repeat="url in array track by $index">
    <span ng-bind-html="url | parseText"></span>
  </p>
</body>

</html>

票数 0

Stack Overflow用户

发布于 2016-08-07 09:56:17

嗯，我现在有个解决方案了.

.filter('parseText', function ($sce, $sanitize) {
return function ( text ) {
var mydomain = 'http://www.mydomain.tdl';
text = $sanitize(text);
var source,sear,repl;
var newString;
var regex = /href="([\S]+)"/g;
var extMatch = /http|https|\/\//g;
var mtMatch = /mailto:/g;

var div = document.createElement("div");
div.innerHTML = text;
var aList = div.getElementsByTagName("a");
var aListNew = new Array();
var href,t;

if(aList.length>0){

for(var i = 0; i<aList.length; i++ ){
  href = aList[i].getAttribute("href");
  t = aList[i].outerHTML;
  t = $sanitize(t);

  if(href.match(extMatch)!=null){
    newString = t.replace(regex, "class=\"externalURL\" onClick=\"cordova.InAppBrowser.open('$1', '_blank', 'location=yes')\"");

  } else if(href.match(mtMatch)!=null){
    newString = t;
  } else{
    newString = t.replace(regex, "class=\"externalURL\" onClick=\"cordova.InAppBrowser.open('"+mydomain+"$1', '_blank', 'location=yes')\"");
  }

  source = text;
  sear = t;
  repl = newString;
  text = text.replace(t,newString);
     }   
 }
 return $sce.trustAsHtml(text);
     };
 });

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/38807378

复制

相似问题

问用angular正则表达式替换href
EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问用angular正则表达式替换hrefEN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问用angular正则表达式替换href
EN