javascript - 如何缩短 url 以仅使用 angular.js 过滤器显示域

Question

我的 Json 中有一些长网址，我试图找出使用 angular 过滤器或仅显示一些 javascript 的域的最佳方法？

http://www.example.com/page-with-a-long-long-long-OMG-so-long-name.html

至

www.example.com

谢谢你 ！

Answer 1

在 AngularJS 中创建自己的过滤器真的很容易：

app.filter( 'domain', function () {
  return function ( input ) {
    var matches,
        output = "",
        urls = /\w+:\/\/([\w|\.]+)/;

    matches = urls.exec( input );

    if ( matches !== null ) output = matches[1];

    return output;
  };
});

您可以在视图中轻松调用：

<span>{{ myUrl | domain }}</span>

这是一个 Plunker：http ://plnkr.co/edit/bVSv7n?builder&p=preview

这是一个超级简单的正则表达式，您可能想要扩展它，但它确实有效！

Answer 2

这个角度过滤器也可以工作！

它真的很酷很简单，因为它利用了浏览器内置的 URI 解析功能，而不是依赖于正则表达式。

angular.module('myCoolApp')
  .filter('urlFilter', function ($document) {
    return function (input) {
      var parser = document.createElement('a');
      parser.href = input;
      return parser.hostname;
  };
});

您可以像这样在您的视图中实现它。

{{ myLongURL | urlFilter }}

如果myLongURL是http://www.example.com/page-with-a-long-long-long-OMG-so-long-name.html，那么它将example.com在通过过滤器后显示。如果你想要一www.开始你可以这样做！

www.{{myLongURL | urlFilter}}

Answer 3

用于location.hostname获取没有应计的域。

http://fiddle.jshell.net/TUeJ7/

Answer 4

我创建了这个过滤器

angular.module('App').filter( 'domainOfUrl',['$filter',function ($filter) {
  return function ( input ) {
     var urlParts = input.split('/');      
    return urlParts[2];
  };
}]);

上面的过滤器是这样工作的：

输入 ：https://www.amazon.in/b/ref=s9_acss_bw_***_x

输出：www.amazon.in

$filter如果需要，请使用。