javascript - urlを短縮してangular.jsフィルターのみでドメインを表示する方法

Question

Jsonに長いURLがいくつかあり、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>

これがプランカーです： 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てください。