Warum window.open funktioniert nicht, um einen Telefonanruf Link zu öffnen? mein vollständiger Code

Question

Hier ist,

<div data-ng-repeat="cont in contacts | filter: searchText"> 
<h4 class="contacts" style="border-bottom: none;">{{cont._id}}</h4> 
<ul> 
     <li data-ng-repeat="c in cont.subgroup" class="contacts"> 
     <div class="contact_person"> 
     <img ng-src="https://127.0.0.1/uploads/pp/{{c.empic}}" onerror="this.src='https://hive.robi.com.bd/uploads/logo.png'" /> 
     <div class="contact_info info"> 
      <p class="contInfo">{{c.name}}</p> 
      <p class="contInfo">{{c.contact}}</p> 
      <p class="contInfo">{{c.email}}</p> 
     </div> 
     </div> 
     <div class="call"> 

    <a onclick="window.open('tel:+{{c.contact}}')"><img src="img/call.png"     id="callImg"></a> 

     </div>   
     </li> 
     </ul> 

    </div> 

In <a onclick="window.open('tel:+{{c.contact}}')"><img src="img/call.png" id="callImg"></a>

es öffnet neuen Tab und Anrufe sagen: + {{c.contact}} aber warum {{c.contact}} ist nicht immer die Wert, wie eine Telefonnummer?

N.B. Ich habe versucht ng-click, ng-href, href nichts funktioniert.

Answer 1

Sie sollten ng-click verwenden. nicht onclick, verwenden Winkel {{}} Syntax ... :-)

Ie:

<a ng-click="window.open('tel:'{{c.contact}})">...</a> 

Oder noch besser (wie von @ Martin Antwort), ng-href:

<a ng-href="tel:{{c.contact}}">...</a> 

Answer 2

Click Führen Sie das Code-Snippet aus, um ein funktionierendes Beispiel zu sehen.

Warum nicht einfach ng-href verwenden?

function ContactController() { 
 
    this.contact = "+1-312-555-0963"; 
 
} 
 

 
angular.module('app', []).controller('ContactController', ContactController);

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="app" ng-controller="ContactController as c"> 
 
    
 
    <a ng-href="tel:{{c.contact}}"> 
 
     <img src="img/call.png" alt="Dial {{c.contact}}" /> 
 
    </a> 
 
    
 
</div>

Ihr Mobilgerät-Browser sieht, dass das Protokoll der Verbindung tel: ist und die Dialer-Anwendung öffnen, mit der Telefonnummer zur Verfügung gestellt.

Answer 3

Ich sagte, ich versuchte ng-href, ng-click in meiner Frage. Ja, ng-href ist korrekt, aber ich fand, dass das Problem etwas anderes war.

war es ein Code-Schnipsel in meinem Controller

.config(function($provide, $stateProvider, $urlRouterProvider, $httpProvider, $ionicConfigProvider, $compileProvider) { 

$compileProvider.aHrefSanitizationWhitelist(/^\s*(http?|ftp|mailto|file|tel|ghttps?|ms-appx|x-wmapp0):/); 
    .... 
    .... 
    // more codes 
} 

In $compileProvider ich fand, dass |tel| fehlte, so dass nach Zugabe dies das Problem behoben wurde.