頁面刷新時的角度材質md-grid-list重疊

我正在處理角材料應用。我有一個頁面，我需要列出一些語言。我正在使用md-grid-list而不是常規的ul和li。但是，當頁面加載/刷新時，在正確顯示之前，列表會重疊一小部分。頁面刷新時的角度材質md-grid-list重疊

代碼

<md-grid-list md-cols-md="3" md-cols-lg="3" md-cols-sm="3" md-cols-xs="2" md-row-height-gt-sm="6:1" md-row-height="7:1" md-gutter="33px"> 
     <md-grid-tile ng-repeat="language in vm.languages" class="language"> 
      <a data-ng-click="vm.changeLanguage(language.key)"><span ng-bind="language.language | humanize"></span></a> 
     </md-grid-tile> 
    </md-grid-list>

這將是巨大的，如果任何人都可以共享一個解決方案。

來源

2016-12-27 Shareer

您加載您的CSS，JS依賴項的順序可能會導致此問題。

如果您可以將材料庫依賴關係移近頁面的初始加載，它可能會解決此問題。您可以通過將jquery和素材庫放入您的html頭中作爲您首次加載的依賴項之一來測試。這些依賴關係對您的應用程序或您的組件是全局的，也可能導致這種情況發生。再次，你可以用前面提到的方法來測試。

我也修復了這個問題的味道，通過在我的html的div容器包裝中使用* ngIf，並且似乎允許在顯示任何內容之前加載站點的依賴關係。不過，我仍然會嘗試重新安排我的依賴關係。

來源

2016-12-27 05:38:50 Fullstack

嘗試將ng-cloack作爲「md-grid-list」的屬性。

<md-grid-list md-cols-md="3" md-cols-lg="3" md-cols-sm="3" md-cols-xs="2" md-row-height-gt-sm="6:1" md-row-height="7:1" md-gutter="33px"> 
     <md-grid-tile ng-repeat="language in vm.languages" class="language"> 
      <a data-ng-click="vm.changeLanguage(language.key)"><span ng-bind="language.language | humanize"></span></a> 
     </md-grid-tile> 
    </md-grid-list>

來源

2017-04-03 20:41:16

頁面刷新時的角度材質md-grid-list重疊

回答

相關問題