Question

我的项目是一个AngularJs，我有一个画廊照片，当我点击一个图像时，我有一个包含所有图像的模态。

但我的问题是：如何从照片库中检测图像的索引，以便在模式的开始点击器上显示图像？

我的代码：

<div class="item_scroll_dek jq-item-sz" ng-repeat="im in sizeImage" ng-class="{active : $last}"
         ng-style="{'background': 'url('+im.image+') no-repeat center transparent', 'background-size': ''+im.x+' '+im.y+''}"
         ng-click="openGallery(userprofile.profile.images)">
</div>

<script type="text/ng-template" id="popupTmplGallery.html">

<div class="modal-body">
    <div id="Carousel" class="carousel slide" ng-show="isBusiness" >
        <ol class="carousel-indicators">
            <li data-target="Carousel" data-slide-to="$index"   ng-repeat="im in userprofile.profile.images track by $index" ng-class="{active : $first}"></li>
        </ol>
        <div class="carousel-inner carousel-inner-css">
            <div class="item" ng-repeat="im in galeryProfilBusiness track by $index" ng-class="{active : $first}">
                <img style="width: 100%;" ng-src="{{getImages(im)}}" class="img-responsive">
            </div>
        </div>
        <a class="left carousel-control carousel-control-left" href="#Carousel" ng-non-bindable data-slide="prev">
            <span class="glyphicon glyphicon-chevron-left"></span>
        </a>
        <a class="right carousel-control carousel-control-right" href="#Carousel" ng-non-bindable data-slide="next">
            <span class="glyphicon glyphicon-chevron-right"></span>
        </a>
    </div>
</div>
</div>

$scope.openGallery = function (images) {

        var modalInstance =  $modal.open({
            templateUrl: 'popupTmplGallery.html',
            controller: 'ModaleCtrl',
            scope: $scope ,
            resolve: {
                items: function ()
                {
                    return  images;
                }
            }
        });
        modalInstance.result.then(function (test)
            {
                console.log(test);
            },
            function ()
            {
                console.log('testing');
            });

    };

请帮帮我

Answer 1

也许您可以在track by $index上使用ng-repeat。然后，您可以将索引作为参数传递到ng-click。

<div class="item_scroll_dek jq-item-sz" ng-repeat="im in sizeImage track by $index" ng-class="{active : $last}"
     ng-style="{'background': 'url('+im.image+') no-repeat center transparent', 'background-size': ''+im.x+' '+im.y+''}"
     ng-click="openGallery($index)">

或者您可以像这样传递整个图像对象：

<div class="item_scroll_dek jq-item-sz" ng-repeat="im in sizeImage track by $index" ng-class="{active : $last}"
     ng-style="{'background': 'url('+im.image+') no-repeat center transparent', 'background-size': ''+im.x+' '+im.y+''}"
     ng-click="openGallery(im)">

在您的代码中，您可以找到underscore.js的索引。

$scope.openGallery = function(image){ 
  var index = _.indexOf(sizeImage, im);
}

当从图库中单击照片以显示模态时，角度js检测索引

1 个答案: