Javascript 角度隐藏ng中的元素单击时重复

我在我的应用程序中的页面上列出了文章，其中我有一个iframe并覆盖在该iframe上。我希望当用户单击iframe覆盖时，文章的标题会被隐藏。不知道如何在ng重复中实现这一点。这是一段代码，从现在起，点击事件时所有文章的标题都会被隐藏

<ion-item ng-repeat="article in articles" class="item-light">
    <div class="article">
        <a ng-show="article.external_media.length == 0 || article.external_media.url == ''"  href="#/main/article/{{article.id}}" nav-direction="forward" class="article-image-link">
            <img src="{{ fileServer }}/imagecache/cover/{{article.cover_image}}">
            <h1>{{ article.title.split(' ', 7).join(' ') }}</h1>
        </a>
        <div class="iframe" ng-show="article.external_media.length > 0 && article.external_media.url != ''">
            <iframe ng-src="{{article.external_media[0].url | safeUrl }} "></iframe>
            <div class="article-image-link">
                <h1 ng-hide="videoPlaying">{{ article.title.split(' ', 7).join(' ') }}</h1>
            </div>
            <div class="iframe-overlay" ng-click="playVideo()"></div>
        </div>
    </div>
</ion-item>

我已经创建了一个（基本的），让您在尝试做什么的时候领先一步

查看

<div ng-app="app">
  <div ng-controller="helloCnt">

    <div ng-repeat='item in data'>
      <span ng-if="item.hide === undefined || !item.hide">{{item.name}}</span>
      <div ng-if="!item.hide" ng-click="playVideo(item)">
        HIDE
      </div>
      <div ng-if="item.hide" ng-click="stopVideo(item)">
        SHOW
      </div>
      <br/>
    </div>

  </div>
</div>

我创建了一个（基本的）程序，让您在尝试做的事情上领先一步

查看

<div ng-app="app">
  <div ng-controller="helloCnt">

    <div ng-repeat='item in data'>
      <span ng-if="item.hide === undefined || !item.hide">{{item.name}}</span>
      <div ng-if="!item.hide" ng-click="playVideo(item)">
        HIDE
      </div>
      <div ng-if="item.hide" ng-click="stopVideo(item)">
        SHOW
      </div>
      <br/>
    </div>

  </div>
</div>

---

您也可以为此使用$index

控制器

  app.controller('someController',function($scope){

   $scope.videoPlaying = [];

   $scope.playVideo = function(videoSrc,index) {

   $scope.videoPlaying[index] = true;
   $scope.videoSrc = videoSrc + "&autoplay=1";
};

   $scope.stopVideo = function(videoSrc,index) {

   $scope.videoPlaying[index] = false;
   $scope.videoSrc = videoSrc + "&autoplay=1";
};

})

HTML

我只换了两行，其余的都一样

 <h1 ng-hide="videoPlaying[$index]">{{ article.title.split(' ', 7).join(' ') }}</h1>



   <div class="iframe-overlay" ng-click="playVideo($index)"></div>

{{article.title.split（''，7.join（''）}

您也可以为此使用$index

控制器

  app.controller('someController',function($scope){

   $scope.videoPlaying = [];

   $scope.playVideo = function(videoSrc,index) {

   $scope.videoPlaying[index] = true;
   $scope.videoSrc = videoSrc + "&autoplay=1";
};

   $scope.stopVideo = function(videoSrc,index) {

   $scope.videoPlaying[index] = false;
   $scope.videoSrc = videoSrc + "&autoplay=1";
};

})

HTML

我只换了两行，其余的都一样

 <h1 ng-hide="videoPlaying[$index]">{{ article.title.split(' ', 7).join(' ') }}</h1>



   <div class="iframe-overlay" ng-click="playVideo($index)"></div>

{{article.title.split（''，7.join（''）}

如果我是正确的，您想在

playVideo

功能中隐藏单击元素的标题吗？如果我是正确的，您想在

playVideo

功能中隐藏单击元素的标题吗？我尝试了您的建议，但没有任何效果，标题仍然存在。请确保您通过了ng click=“playVideo（videosrc，$index）”两个参数，因为您的函数正在接受两个参数，请检查控制台是否有任何错误。我尝试了您的建议，但它没有做任何事情，标题仍然存在。请确保您正在传递ng click=“playVideo（videosrc，$index）“两个参数，因为您的函数正在接受两个参数，所以还要检查控制台是否有任何错误。不确定如何实现这一点，因为我只需要文章标题消失，而不需要整个文章，所以我必须只传递我理解的标题，而不是整个文章，才能做到这一点，因为我没有在我的范围内定义标题，所以我是从文章对象中获取的。不确定如何实现这一点，因为我只需要文章标题消失，而不是整个文章，所以我只能从我理解的内容中传递标题，而不是整篇文章，因为我没有在我的范围内定义标题，所以我从文章对象中获取它。