javascript - 通过移动浏览器在 whats-app 上共享内容时面临数据绑定(bind)问题

标签 javascript angular whatsapp

我正在开发 Angular 应用程序,我在 watsapp 应用程序上分享内容,通过移动设备的浏览器.. 轻松在移动 whatsapp 应用程序上共享内容

but when I am trying to bind data to it via interpolation , data is not shared

我在下面分享代码->

ts

  team1 : any  = 'India';
  team2 : any  = 'japan';

html

<a 
href="whatsapp://send?text=" 
title="Share On Whatsapp" 
onclick="window.open('whatsapp://send?text=%20{{team1}}%20vs%20{{team2}}%20Take%20a%20look%20at%20this%20awesome%20page%20-%20' 
+ encodeURIComponent(document.URL)); return false;">
whatsapp share
</a>

Issue -> onclick method doesn't support Interpolation due to security reasons So How I can solve this issue

最佳答案

请试试这个:

<a 
href="whatsapp://send?text=" 
title="Share On Whatsapp" 
onclick="window.open('whatsapp://send?text=%20' + team1 +'%20vs%20' + team2 + '%20Take%20a%20look%20at%20this%20awesome%20page%20-%20' 
+ encodeURIComponent(document.URL)); return false;">
whatsapp share
</a>

你不需要双花括号,因为你传递的是变量。 或者你可以用 typescript 准备你的字符串。

private whatsupUrl : string;
this.whatsupUrl = `whatsapp://send?text=%20${this.team1}%20vs%20${this.team2}%20Take%20a%20look%20at%20this%20awesome%20page%20-%20`;
<a 
href="whatsapp://send?text=" 
title="Share On Whatsapp" 
onclick="window.open(whatsupUrl + encodeURIComponent(document.URL)); return false;">
whatsapp share
</a>

关于javascript - 通过移动浏览器在 whats-app 上共享内容时面临数据绑定(bind)问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55789655/

相关文章:

javascript - 有没有一种方法可以结合 Bluebird 的 `then` 和 `catch` 功能?

javascript - 无法更改html中的自定义光标

javascript - 网站上的 WhatsApp 共享按钮。检测 WhatsApp 是否存在的简单方法?

angular - *ngIf 和 [hidden] 有什么区别?

javascript - 以 react 形式设置嵌套表单组/控件值

java - WhatsApp API (java/python)

javascript - WhatsApp LastSeen 功能如何使用

javascript - 按顺序获取数组值并为图像分配链接

javascript - 如何允许点击通过 div 但仍然对悬停使用react?

angular - 以模型驱动形式设置 primeng 下拉列表的值