Embed.ly Twitter小部件内的角度数​​据绑定不起作用

Question

嗨，我正在尝试构建一些棱角分明的东西，您可以在其中提交tweet的URL，它将嵌入该tweet。 我以为我可以将把手贴在embedly的twitter小部件内，但不起作用。 这可能与事件触发的顺序有关。

这是代码

<section data-ng-controller="ArticlesController">

{{article.title}}<p>

<a class="embedly-card" href="{{article.title}}">hi</a><p>

<a class="embedly-card" href="https://twitter.com/jashkenas/status/563803426107449347">bye</a>

<a class="embedly-card" ng-href="{{article.title}}">why</a>

</section>

这就是结果

如您所见，我尝试了几种不同的方法，并且仅在其中粘贴了网址但没有角度数据的情况下它才起作用。 虽然当您单击hi时以及为什么单击链接时，它们确实会将您带到正确的地方。

这是检查页面

一个有效的框架创建了整个iframe，而其他两个框架只是简单的链接。

还应该说我在标题中放了一个嵌入脚本

<script async src="//cdn.embedly.com/widgets/platform.js" charset="UTF-8"></script>

任何帮助深表感谢。 我不是很了解棱角，我只是想玩转而了解一下。 我想也许我现在在。 谢谢。

Answer 1

您遇到的问题是，在Angular渲染DOM元素之前嵌入地渲染该元素，这意味着embedly可能不知道href实际上是什么，并且它停止渲染并且什么也没留下。

您可以参考这些项目1 2了解如何处理渲染顺序。

Answer 2

所以我最终只是延迟了此js的嵌入脚本加载

setTimeout(function() {
    var headID = document.getElementsByTagName("head")[0];         
    var newScript = document.createElement('script');
    newScript.type = 'text/javascript';
    newScript.src = 'http://www.somedomain.com/somescript.js';
    headID.appendChild(newScript);
}, 5000);

我在这里找到https://stackoverflow.com/a/9611751/927591