Ouvrir tous les liens à l'aide du navigateur système dans une application ionique

Autant que je sache, il n'y a pas un moyen de le faire automatiquement, vous devez utiliser l'application navigateur de code js pour ouvrir les liens de l'extérieur de manière cohérente dans chaque plate-forme.

Votre question n'est pas de donner un exemple clair de ce que le serveur renvoie donc je suis en supposant que vous êtes l'obtention d'un bloc complet de html et sont juste rendu à l'écran. En supposant une demande de retour quelque chose de simple comme :

<div id="my-links">
   <a href='http://externallink.com'> External Link 1 </a>
   <a href='http://externallink.com'> External Link 2 </a>
   <a href='http://externallink.com'> External Link 3 </a>
</div>

Et votre demande ressemble:

$http.get('givemelinks').success(function(htmlData){
   $scope.myContent = htmlData;
})

Si vous avez accès à la partie serveur et peut apporter des modifications:

Ajouter un "inappbrowser" paramètre de votre demande afin de détecter si elle doit retourner inappbrowser compatible liens et de modifier la réponse de votre serveur pour être quelque chose comme:

if (inappbrowser) {
<div id="my-links">
   <div ng-click='openExternal($event)' data-external='http://externallink.com'> External Link 1 </div>
   <div ng-click='openExternal($event)' data-external='http://externallink.com'> External Link 2 </div>
   <div ng-click='openExternal($event)' data-external='http://externallink.com'> External Link 3 </div>
</div>
} else {
 <div id="my-links">
   <a href='http://externallink.com'> External Link 1 </a>
   <a href='http://externallink.com'> External Link 2 </a>
   <a href='http://externallink.com'> External Link 3 </a>
</div>
}

Et ont un générique openExternal méthode:

$scope.openExternal = function($event){
  if ($event.currentTarget && $event.currentTarget.attributes['data-external'])
  window.open($event.currentTarget.attributes['data-external'], '_blank', 'location=yes');
}

Si vous ne pouvez pas changer le côté serveur

Analyse de la réponse et de remplacer les liens avec ng-clics:

$http.get('givemelinks').success(function(htmlData){
   htmlData = htmlData.replace(/href='(.*)'/,'ng-click="openExternal($event)" data-external="$1"').replace(/<a/,"<div").replace(/a>/,"div>")
   $scope.myContent = htmlData;
})

Et utiliser le même openExternal méthode que ci-dessus.

Je suis en remplaçant les ancres avec les divisions afin d'éviter toute modification de l'application des routes. Qui pourrait ne pas être nécessaire dans toutes les applications.

Pour que ce soit encore mieux, vous devez l'associer à un open-external directive de sorte que vous pouvez l'utiliser dans de multiples contrôleurs et de le garder propre.

Parce que le HTML est déjà rendu quand il s'agit de Coudé, et la inAppBrowser plugin ne fonctionne que si elle est appelée explicitement par le Javascript, il n'y a rien que vous pouvez faire qui n'implique pas de modifier manuellement le code HTML ou en utilisant un javascript.

Changer le HTML, c'est juste une Mauvaise Idée®, en particulier si vous essayez de le faire en utilisant l'expression rationnelle correspondant.

Qui laisse javascript:

Restangular.all('stories').getList().then(function(stories){
  $scope.stories = stories;
  updateLinks();
});

function updateLinks(){
  //use $timeout wait for items to be rendered before looking for links
  $timeout(function(){
      var $links = document.querySelectorAll(".stories .story a");
      for(var i =0; i < $links.length; i++) {
        var $link = $links[i];
        var href = $link.href;
        console.log("Hijacking link to ", href);
        $link.onclick = function(e){
          e.preventDefault();
          var url = e.currentTarget.getAttribute("href");
          window.cordova.inAppBrowser.open(url, "_system");
        }
      }
    });
}

<ul>
<li> <a href="#"  ng-click='openlink($event)' data-link='https://www.link1.com'> Link 1 </a></li>  
<li> <a href="#"  ng-click='openlink($event)' data-link='https://www.link2.com'> Link2 </a></li>  
<li> <a href="#"  ng-click='openlink($event)' data-link='https://www.link3.com'> Link 3 </a></li>  
</ul>

Dans le contrôleur

 angular.module('app', [])
    .controller('LinkCtrl', function($scope) {
         $scope.openlink = function($event)
            {               
              if ($event.currentTarget && $event.currentTarget.attributes['data-link'])
                    {
                   window.open($event.currentTarget.attributes['data-link'], '_system', 'location=yes');
                    }
                }

    })