Question

使用角度2，（或4）构建Web应用程序。想通过whatsapp发送消息。这可以很好地whatsapp://send?text=hi!从浏览器打开whatsapp。我想发送当前页面的网址。我可以使用{{url}}在网页上打印网址，但如果您知道我的意思，我不知道如何设置text = {{url}}。

组件的相关部分`

export class ActivityDetailsComponent implements OnInit {


  @Input() activity: any;
  @Output() close = new EventEmitter();
  error:any;
  navigated = false;
  sub: any;
  imageURL: string;
  location:Location;
  url: any;

  constructor(private activitiesService:ActivitiesService,
                private route: ActivatedRoute,
                private router: Router,
                private pics: PicsService,
                location:Location             

                ) { 

                this.location = location;
                this.url = this.location.path();

                 }

`

相关的HTML `

    Send a link to this activity to your
     <a href="whatsapp://send?text=http://ec2-52-209-95-130.eu-west-  
 1.compute.amazonaws.com:4200/activities/58c003d47513092fac820f09">whatsapp</a>
     contacts  

    http://ec2-52-209-95-130.eu-west-1.compute.amazonaws.com:4200{{url}}

`

Answer 1

有两种可能的技术可以解决您的问题：

Property binding

我们使用方括号来告诉angular来解析href字段的值。另外我们使用简单的字符串连接：

<a [href]="'http://example.org/?test=' + url">whatsapp</a>

Interpolation

这种技术使用大括号，是您尝试使用的方法：

  <a href="{{'http://example.org/?test=' + url}}">whatsapp</a>

在您的情况下，您可以选择您喜欢的解决方案，官方文档（与上面相同的链接）声明如下：

将数据值渲染为字符串时，没有技术理由喜欢一种形式到另一种形式。你倾向于倾向于可读性赞成插值。您建议建立编码样式规则并选择既符合规则又感觉最多的形式对于手头的任务很自然。

Answer 2

使用以下代码完成

var url = document.URL var red = (url.substr(url.lastIndexOf('=') + 1)); window.location.replace("https://api.whatsapp.com/send?text=" + red);

或者您可以使用下面的永久链接直接运行而无需任何脚本

https://www.educlick.page/p/whats-app-redirect.html?url>url encode<

从angular 2 web应用程序发送whatsapp消息

2 个答案: