造型材料網格列表項

Question

所以這個：

<md-grid-list cols="5" rowHeight="20px"> 
     <md-grid-tile 
      *ngFor="let carBrand of carBrands" 
      colspan= 1 
      rowspan= 1> 
     <md-checkbox>{{ carBrand}}</md-checkbox> 
     </md-grid-tile> 
    </md-grid-list> 

產生我的名單，但在所有的cols項目爲中心。我在開發工具中看到，如果我將justify-content: center更改爲justify-content: left，它可能運行良好，但在我的代碼中無法實現相同的效果。

如何正確樣式這些？

Answer 1

設置View Encapsulation爲None您的組件上：

@Component({ 
    templateUrl: './my.component.html' , 
    styleUrls: ['./my.component.css'], 
    encapsulation: ViewEncapsulation.None, 
}) 

然後在你的組件的CSS，你可以做你的開發者工具嘗試什麼，重寫風格justify-content: left

查看封裝=無意味着Angular不會查看封裝。 Angular將CSS添加到全局樣式中。前面討論的規則，隔離和保護範圍不適用。這個 與將組件的樣式粘貼到HTML中的基本相同。