Geek Answers Handbook

Exchange Whatsapp in AngularJS

Be that as it may, it will not work, as this code cannot detect AngularJS codes.

<a href="whatsapp://send?text={{challenge.challenge_title}}" data-action="{{FullURL}}">Whatsapp</a>

Do I need a directive for this? If yes, what is it? Someone with experience in AngularJS, kindly help.

+5
source share
2 answers

You need to sanitize the href anchor in the config angular phase, which will allow your href with whatsapp prefix.

code

 app.config(function($compileProvider){ //other configuration code here $compileProvider.aHrefSanitizationWhitelist(/^\s*(whatsapp):/); })

See SO Question for more details.

+9
source

I ran into an unsafe URL problem after using $ compileProvider.aHrefSanitizationWhitelist (/ ^ \ s * (whatsapp): /); when i read the angular docs it says:

aHrefSanitizationWhitelist ([regular expression]); Retrieves or overrides the default default regular expression, which is used to remove secure URLs during [href] disinfection. Disinfection is a security measure designed to prevent XSS attacks through html links. Any url that needs to be bound to [href] via data binding is first normalized and converted to an absolute URL. Subsequently, the URL maps to the regular expression aHrefSanitizationWhitelist. If a match is found, the original url is written to dom. Otherwise, the absolute url has the string prefix "unsafe:", and only after that it is written to the DOM. "If a match is found, the original url is written to dom. Otherwise, the absolute url is prefixed with the string" unsafe: ", and only then is it written to the DOM." Thus, for all other URLs except whatsapp, the match will not be found and it will be marked as unsafe

Another way to make a directive

 angular.module('shareLink') .directive('whatsApp', function (){ return{ link: function (scope, elem, $attr){ elem.on('click', function (){ var text = $attr.text; var url = $attr.whatsApp; var message = encodeURIComponent(text) + " - " + encodeURIComponent(url); var whatsapp_url = "whatsapp://send?text=" + message; window.location.href = whatsapp_url; }); } } }); 
 <a class="sharelink whatsapp" data-action="share/whatsapp/share" data-text="you can add title or any text here" whats-app="{{url}}"> <i class="fa fa-whatsapp "></i> WHATSAPP </a>
0
source

More articles:


All Articles