Angular-带有窗口对象的Twitter直接消息在Safari中不起作用

Question

我想用预先填充的文本编写一个Twitter DM。目前，我正在使用window.open((编写消息。

window.open(https://twitter.com/messages/compose?text=${this.helloWorld}(；

helloWorld="测试测试"；

它在windows和android上运行良好，但我无法在iPhone上获得预先填充的文本。

这是代码：

handleSocialClick(){ window.open(https://twitter.com/messages/compose?text=${this.helloWorld}) }

<a (click)="handleSocialClick()" [ngClass]="socialOption.panelClass"> 
<i [ngClass]="socialOption.icon"></i> {{socialOption.name}} </a>

有什么想法吗？

Answer 1

由于浏览器策略的变化，您无法安全地依赖window.open。

为了使window.open()在iOS上的safari中工作，您可以将其放置在元素的onclick属性中。

下面是一个带有按钮的示例，但您可以在使用的任何容器元素上放置onclick事件：

<button class='button' onclick='window.open("https://twitter.com/messages/compose?text=${this.helloWorld}", "_blank");'>Twitter Message</button>

如果您使用异步调用来检索URL，请记住：Safari会阻止异步调用中对window.open()的调用。解决方法是在asnyc调用之前调用window.open，并在解决promise之后设置位置。

示例：

var myWindowRef = window.open();
someService.getUrl().then(function(url) {
myWindowRef .location = url;
});

关于您的具体情况：

在您的组件中.ts:

import { Component } from '@angular/core';
@Component({
selector: 'my-app',
templateUrl: './app.component.html',
styleUrls: [ './app.component.css' ]
})

export class AppComponent  {
...
..
helloWorld = 'Hello World';
handleSocialClick(){ 
window.open(`https://twitter.com/messages/compose?text=${this.helloWorld}`) 
}
}

在您的component.html中：

...
..
<a (click)="handleSocialClick()" [ngClass]="socialOption.panelClass"> 
<i [ngClass]="socialOption.icon"></i> {{socialOption.name}} </a> 
...
..