My app contains a lot of links on different cards (each card respresents an event). When using the classical "", links are correctly shown but not followed. I have added the Cordova 'InAppBrowser' plugin but it doesn't works as expected. It is wrongly presented and links do not work either. My problem has some special situation: text containing links is stored on a JS array like this one (you can see the problematic link there, in the last event):
$scope.eventsBulls = [
{ eventTitle: 'Clase Práctica', eventHour: '19:00', eventText: 'Clase práctica por los alumnos de Escuelas Taurinas con 6 erales de <b>López Gibaja</b>.<br/><br/><b>Entrada GRATUITA</b>', eventPlace: 'Plaza de Toros de Almería', eventIcon: 'img/icon-toro.png', show: false },
{ eventTitle: 'Corrida de Toros', eventHour: '19:00', eventText: '(1ª de Abono) Corrida de toros ganadería <b>Zalduendo</b><br/><br/><b>El Juli</b><br/><b>Alejandro Talavante</b><br/><b>López Simón</b>', eventPlace: 'Plaza de Toros de Almería', eventIcon: 'img/icon-toro.png', show: false },
{ eventTitle: 'Corrida de Toros Mixta', eventHour: '19:00', eventText: ' (2ª de Abono) Corrida de toros ganaderías <b>Luis Terrón</b> (2 Toros) y <b>Daniel Ruíz</b> (4 Toros)<br/><br/><b>Hermoso de Mendoza</b><br/><b>Enrique Ponce</b><br/><b>Roca Rey</b>', eventPlace: 'Plaza de Toros de Almería', eventIcon: 'img/icon-toro.png', show: false },
{ eventTitle: 'Corrida de Toros', eventHour: '19:00', eventText: ' (3ª de Abono) Corrida de toros ganadería <b>Núñez de Tarifa</b><br/><br/><b>Sebastián Castella</b><br/><b>Miguel Ángel Perera</b><br/><b>Paco Ureña</b>', eventPlace: 'Plaza de Toros de Almería', eventIcon: 'img/icon-toro.png', show: false },
{ eventTitle: 'Corrida de Toros', eventHour: '19:00', eventText: ' (4ª de Abono) Corrida de toros ganadería <b>Victorino Martín</b><br/><br/><b>Manuel Escribano</b><br/><b>Torres Jeréz</b><br/><b>Román Collado</b> (<a class="item" href="#" onclick="window.open(\'http://www.romancollado.com/\', \'_system\',\'location=yes\'); return false;">Información</a>)', eventPlace: 'Plaza de Toros de Almería', eventIcon: 'img/icon-toro.png', show: false }
];
As embedding HTML text can cause problems, I used this:
<p ng-bind-html="event.eventText" style="text-align: justify;"></p>
So text is correctly parsed into HTML, but I don't know if this is causing problems.
As said, links are not shown nor followed now. I have tried escaping the ' character as compiler complains about it but still no luck.
Any suggestions?
I managed to solve this by following instructions here and using the filter they suggest (I needed to use '_system' becase I have 'tel:' links too that do not work on InApp browsing):