Question

您好我正在尝试使用angular来构建内容，您可以在其中提交推文的网址，它会嵌入推文。我以为我可以把把手放在嵌入式推特小部件里面，但它不起作用。这可能与事件发生的顺序有关。

这是代码

<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>

这是result

正如你所看到的，我尝试了几种不同的方式，当它只是粘贴在那里而不是角度数据时，它可以工作。虽然当你点击喜欢和为什么链接他们确实带你到正确的地方。

这是inspecting the page

有效的人创造了整个iframe，但其他人只是简单的链接。

还应该说是我在标题中放入的嵌入式脚本

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

非常感谢任何帮助。我真的不知道棱角分明，我只是想四处游玩并学习一下。我想也许我现在。谢谢。

Answer 1

你遇到的问题是在Angular渲染DOM元素之前嵌入渲染元素，这意味着嵌入可能不知道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

嵌入式Twitter小部件内部的角度数据绑定不起作用

2 个答案: