Question

抱歉这是我的新问题，以前有一个问题是用新的编辑这个..

这是我的新问题我创建了一个带滑块的图像弹出窗口，在从图库中单击一个图像时，我需要在弹出窗口和滑块中显示特定图像，我正在使用NgFor for Image Gallery，在弹出窗口期间使用另一个ngFor for slider，我需要可点击的图片ID并在弹出窗口中显示特定图像，并使用ngrx-store 这是我的代码，

 <div class="swiper-slide " *ngFor="let picture of pictures; let i = index">
        <div class="zoomImage" >
            <img class="img-fluid GridImage" 
                 (click)="lgModal.show()"
                 src="{{picture.regularUrl}}">
        </div>
    </div>

    <div *ngIf="pictures.length%2 !=0" class="swiper-slide ">
        <!--<img  class="img-fluid GridImage"-->
        <!--src="../../assets/images/dummy-image.jpg" />-->
        <img class="img-fluid GridImage"
             src="http://dev.rileyblakedesigns.com/media/productimage-
    picture-c120-lightgray-27516.jpg"/>
    </div>
<!--</swiper>-->

<div bsModal #lgModal="bs-modal" class="modal fade" tabindex="-1"
     data-a8n="popUp OverLay" id="backgroundPopUp"
     role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
    <button type="button" class="close pull-right"
            data-a8n="PopUp Close Button" id="popCloseBtn"
            (click)="lgModal.hide()" aria-label="Close">
        <span aria-hidden="true">&times;</span>
    </button>

    <carousel [interval]="'false'" [noWrap]="'true'" id="thumbChange" >
        <div style=" " class="closeDiv"
             (click)="lgModal.hide()" >
            <div class="modal-dialog modal-lg">

               <div class="modal-content" >
                  <div class="modal-body">
                    <slide *ngFor="let picture of pictures; let i = index" >
                        <div >
                            <img class="img-fluid popUpImage" 
                                 src="{{picture.regularUrl}}" >
                            <div class="pull-right imageCount"
                                 ">
                                <h6 class="countPic" >{{i+1}} of {{ 
                          pictures.length}}</h6>
                            </div>
                        </div>
                    </slide>
                  </div>
               </div>
            </div>

        </div>

        <div class="PopUp-Thumbnail"  data-a8n="PopUp-Thumbnail"
             style="">
            <span *ngFor="let picture of pictures; let i = index" >
                <img class="img-fluid GridImagePopUp active" 
          id="thumbnailImage"
                src="{{picture.thumbnailUrl}}">
        </span>
        </div>

    </carousel>

</div>

Answer 1

而不是“数据”尝试使用“params”，如下所示：

var App= angular.module('myApp',[]);
App.controller('MainCtrl', function ($scope ,$http) {
    $scope.userName ="usern";
    $scope.password ="pass";

    $http({
        method :'GET',
        url:' paste url here',
        params: { username :  $scope.userName , password: $scope.password},

        headers: {'Content-Type': 'application/json'}
    }).success(function (data, status, headers, config) 
{
        console.log('status',status);

        console.log('data',status);
        console.log('headers',status);
    });
});

这是应该如何运作的。见https://docs.angularjs.org/api/ng/service/$http#usage

Answer 2

如果是基本HTTP授权，则应该对您进行身份验证。

var App= angular.module('myApp',[]);
App.controller('MainCtrl', function ($scope ,$http) {
    $scope.userName ="usern";
    $scope.password ="pass";

    $http({
        method :'GET',
        url:' paste url here',
        headers: {'Content-Type': 'application/json','Authorization':'Basic '+btoa($scope.userName+':'+$scope.password)}
    }).success(function (data, status, headers, config) 
{
        console.log('status',status);

        console.log('data',data);
        console.log('headers',headers);
    });
});

如何从一个ForLoop（NgFor）到另一个获取当前ID

2 个答案: