排列为大小列在引导

我动态打印引导栏div的使用angular2排列为大小列在引导

[col-md-6][col-md-12][col-md-6][col-md-12][col-md-6][col-md-12][col-md-6][col-md-12]

如下，但实际的网格显示为

[col-md-6] 
[col-md-12] 
[col-md-6] 
[col-md-12] 
[col-md-6] 
[col-md-12] 
[col-md-6] 
[col-md-12]

我要像

安排列

[col-md-6][col-md-6] 
[col-md-12] 
[col-md-12] 
[col-md-6][col-md-6] 
[col-md-12] 
[col-md-12]

这里是代码

  <div class="row"> 
       <span *ngFor="let serviceItem of dashboardServicesList"> 
        <div class="col-md-6 {{serviceItem.service}}-service"> 
         <div class="service"> 
          <a *ngIf="serviceItem.categoryHashmap" (click)="showSegments($event,serviceItem.service)"> 
           <span class="service-title">{{serviceItem.displayName}}</span> 
           <i class="fa {{serviceItem.chevron}}" aria-hidden="true"></i> 
          </a> 
         </div> 
        </div> 
        <div *ngIf="serviceItem.categoryHashmap" class="col-md-12 segments {{serviceItem.is_active}} {{serviceItem.service}}"> 
         <ul class="segments-boxes"> 
          <li *ngFor="let item of serviceItem.serviceSegments"> 
           <a target="_blank" href="{{item.url}}">{{item.displayName}}</a> 
          </li> 
         </ul> 
        </div> 
       </span> 
      </div>

如何安排？谢谢。

来源

2017-06-13 Devidas Kadam

好。为什么不按照你想要的顺序打印呢？如果你没有分享你的问题的一个工作示例（片段），我们不能帮助你很多 –

你是否可以将每个包装成一行？ ......正如我们所指出的，我们需要看到你使用的代码 – LGSon

它是动态的，查看col-md-6我显示的是主要服务，在col-md-12显示子服务，我必须显示子服务在每项服务的第12栏中。 –

发生这种情况的原因是因为您使用的顺序。

col-md-6 + col-md-12 = col-md-18

这将不适合在一个row而这就是为什么它不工作。

解决您的序列，并添加row的它，输出如下例所示：

[row][col-md-6][col-md-6][row][row][col-md-12][row][row][col-md-12][row][row][col-md-6][col-md-6][row][row][col-md-12][row]

希望这有助于！

来源

2017-06-13 11:31:44 Deathstorm

每个组都需要开始和结束行标记...自己更新它，并upvoted – LGSon

@LGSon Ofcourse哈哈谢谢（： – Deathstorm

@Deathstorm，Ofcourse我知道col-md-6和col-md- 12不能排成一行，你会从我的代码中明白，改变序列并将它们包装成行是不容易的。 –

排列为大小列在引导

回答

相关问题