如何在 ng-click 上 ng-show 列表项中的特定元素？

Question

如何在 ng-click 中显示 li 中的 iframe 元素，仅针对特定的点击元素？
并使用 AngularJs.

隐藏所有 iframe

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
<script>
    var app = angular.module("myApp", []);
    app.controller("myCtrl", function ($scope, $http, $sce) {
        var indx;
        $scope.PlayFun = function (order) {
            indx = order;
            // I need this fuction because I do a lot of things inside
        };


    });
</script>

<div data-ng-app="myApp" data-ng-controller="myCtrl">
    <ul style="list-style-type: none">
        <li data-ng-click="PlayFun($index)" data-ng-repeat="x in records">
            <div data-ng-if="indx === $index">
                <iframe id="video" style="width: 100%; height: 300px;" 
                        data-ng-src="{{videoSource}}" allowfullscreen>
                </iframe>
            </div>
        </li>
    </ul>
</div>

换句话说，我只需要：
我需要通过单击 li 来执行 PlayFun。并通过 $index 显示 iframe。

Answer 1

您应该 在 $scope 中创建一个属性，而不是将值分配给 indx 变量，如下所示

   $scope.PlayFun = function (order) {
       $scope.indx = order;
   };

我们可以在 HTML 中访问 $scope 的属性和方法。

如何在 ng-click 上 ng-show 列表项中的特定元素？

how to ng-show specific element inside list item on ng-click?

javascript

angularjs

angularjs-ng-repeat