Angularjs 单击共享时关闭其他文章上的股票期权

我希望在AngularJS的文章列表中添加社交分享。
我已经实现了按下共享按钮的切换，但是如果我在另一篇文章中单击共享按钮，我希望关闭这篇文章中的选项

现在，当我点击

.share article

时出现的每一个股票期权都将保持打开状态（有效地允许页面混乱）。我只想打开活动的那个

<span class="article-title">
  <a href="{{article.url}}">{{article.title}}</a>
</span>
<div class="click-items">
  <a ng-click="articles.removeArticle($index)" class="delete-article clickable" title="Remove article">
    <span>&#10006;</span>
  </a>
  <a ng-click="socialShare = !socialShare" class="share-article clickable">
    <span class="plus-sign" title="Share">&#10006;</span>
    <div social-share ng-show="socialShare" class="social-share arrow-down">
      <div ng-click="socialShare = !socialShare" class="addthis_toolbox addthis_default_style addthis_16x16_style" 
      addthis:title="{{article.title}}" addthis:description="{{article.extract}}" addthis:url="{{article.url}}">
        <a class="addthis_button_facebook"></a>
        <a class="addthis_button_twitter"></a>
        <a class="addthis_button_google_plusone_share"></a>
        <a class="addthis_button_reddit"></a>
        <a class="addthis_button_hackernews"></a>
        <script type="text/javascript">var addthis_config = {"data_track_addressbar":true};</script>
        <script type="text/javascript" src="//s7.addthis.com/js/300/addthis_widget.js#pubid=ra-529b989f77fb3475"></script>
      </div>
    </div>
  </a>
</div>

✖
✖
var addthis_config={“数据轨道地址栏”：true}；

---

如何做到这一点？

要做到这一点，您需要跟踪每个共享按钮集的状态。您正在为此使用我相信的

socialShare

变量。很可能您正在使用一个

ng repeat

，因此在每个repeat作用域上创建此变量，有效地创建了n

socialShare

变量，该变量不可在repeat子作用域之外访问

解决此问题的一种方法是，在此行的article对象上使用

socialShare

变量

<div social-share ng-show="article.socialShare" class="social-share arrow-down">

---

您还可以查看库手风琴控件。

jsbin.com请演示？@m59抱歉，我以前从未将JSFIDLE用于Angular，如何导入模块？我没有得到模块：ngAnimate，我不喜欢jsfiddle（为什么我推荐jsbin）。对于jsbin，像通常一样包含脚本。对于JSFIDLE，使用左边的外部资源选项卡。顺便说一句，去掉所有额外的代码并发布与您的问题相关的内容确实是个好主意。我看到大量的标记和类等与您的实际问题无关。非常酷！现在，您将如何为实际切换添加回功能（即：双击Set

article.socialShare

返回到

false

）？没关系，我找到了它，并将其添加到您的答案中，供未来的观众使用。谢谢

$scope.toggle=function(article) {
    angular.forEach(articles,function(article) { 
         article.socialShare=false;   //This would close all open items
    });
    article.socialShare=true;         // This will show the item selected.

}