Вопрос:

Сделайте номер телефона кликабельным в угловом

angularjs

4201 просмотра

2 ответа

269 Репутация автора

Я могу сделать телефон активным:

<a href="tel:+1-800-555-5555">Call 1-800-555-5555</a>

Однако я собираю телефонные номера из базы данных, и я не уверен, как сделать так, чтобы захват телефона вызывал щелчок:

    <strong>Phone:</strong> <i class="glyphicon glyphicon-earphone"></i> {{e.Phone | PhoneNumber}}

ОБНОВИТЬ

<div>
<nav class="hidden-xs visible-md visible-lg" ng-show="ShowResults"><uib-pagination boundary-links="true" max-size="maxPageNumbersToShow" ng-model="currentPage" total-items="resultsCount"> </uib-pagination></nav>

<nav class="visible-xs hidden-md hidden-lg" ng-show="ShowResults"><uib-pager ng-model="currentPage" total-items="resultsCount"> </uib-pager></nav>

<div class="container">
    <div id="searchResults" ng-repeat="e in providers" ng-show="ShowResults">
        <div class="row">
            <hr />
            <h4>{{e.FullName}}</h4>
        </div>

        <div class="row">
            <div class="col-md-4 no-margin padding"><strong>Specialty: </strong>{{e.Specialty}}<br />
                <span class="padding"><strong>Gender:</strong> {{e.Gender}}</span><br />
                <strong>Language(s):</strong> {{e.Languages}}</div>

            <div class="col-md-4 no-margin"><strong>Clinic: </strong> <i class="glyphicon glyphicon-map-marker"></i> <a href="https://maps.google.com?saddr=Current+Location&amp;daddr={{e.GoogleParams}}" target="_blank"> {{e.Address1}}</a><br />
                <span class="shiftAdd padding"><a href="https://maps.google.com?saddr=Current+Location&amp;daddr={{e.GoogleParams}}" target="_blank">{{e.Address2}}</a> </span><br />
                <strong>Phone:</strong> <i class="glyphicon glyphicon-earphone"></i> <a href={{e.Phone}}></a></div>
        </div>
    </div>
</div>
&nbsp;

<nav class="visible-xs hidden-md hidden-lg" ng-show="ShowResults">
    <hr /><uib-pager ng-model="currentPage" total-items="resultsCount"> </uib-pager></nav>

Обновление 2

Вот что я сделал, чтобы определить, должен ли номер телефона быть кликабельным:

var probablyPhone = ((/iphone|android|ie|blackberry|fennec/).test(navigator.userAgent.toLowerCase()) && 'ontouchstart' in document.documentElement);

    function initialize() {
        (function($) {
            $('.call').css("text-decoration", "none");
            $('.call').css("color", "black");
            $('.call').css("cursor", "default");
        })(jQuery);
    }

и что добавляется в тег:

<a href={{'tel:'+e.Phone}} onclick="return probablyPhone;">{{e.Phone | PhoneNumber}}</a>

Не уверен, почему это не работает

Любая помощь будет оценена, спасибо

Автор: Roberto Flores Источник Размещён: 22.08.2016 09:03

Ответы (2)


5 плюса

1776 Репутация автора

Решение

Пытаться

<a href={{'tel:'+e.Phone}}>{{e.Phone | PhoneNumber}}</a>
Автор: Łukasz Размещён: 22.08.2016 09:19

1 плюс

11 Репутация автора

Для Angular 2+ попробуйте

<a [href]="`tel:${e.Phone}`">Call {{e.Phone}}</a>
Автор: darkbcx Размещён: 11.02.2019 05:42
Вопросы из категории :
32x32