2017-05-14 39 views
1

我无法通过侧enter image description here侧通过在角2侧的图像,自举4

<div class="row"> 
 
     <div class="col"> 
 
      <div *ngFor="let ir of imagesSource"> 
 
       <div class="row"> 
 
        <div class="col-md-3"> 
 
              <img class="fade images" src="{{ir?.contentUrl}}" (click)="ImageSource(ir?.hostPageUrl)" frameborder="0" allowfullscreen> 
 
             </div> 
 
            </div> 
 
           </div> 
 
          </div> 
 
         </div>

来渲染图像侧我怎样才能呈现图像并排,3-在每一行中

+0

把ngFor上.COL-MD-3,不在.row或其父项上。否则,每个图像都会有一行。并使其成为一个col-md-4,因为12/3是4,而不是3. –

回答

0

您已将您的行计算分为12.由于您将ngFor保存在错误的位置,它会重复与单个项目的行。你可以只是一个简单的行作为包装的div和重复内分度col-md-3

<div class="row"> 
     <div class="col-md-3" ngFor="let ir of imagesSource"> 
     <img class="fade images" 
      src="{{ir?.contentUrl}}" 
      (click)="ImageSource(ir?.hostPageUrl)" frameborder="0" allowfullscreen> 
     </div> 
</div> 
+0

Pankaj你能帮我吗我有一个关于stackoverflow的问题请看链接bro http://stackoverflow.com/questions/43963853/how-到环至2倍,更深入的功能于angular2-4与 - ngfor – George

0

试试这个,我希望的是帮助

<div class="row"> 
    <div *ngFor="let ir of imagesSource" class="col-md-3"> 
     <img class="fade images" src="{{ir?.contentUrl}}" (click)="ImageSource(ir?.hostPageUrl)" frameborder="0" allowfullscreen> 
    </div>   
</div>