页面刷新时的角度材质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重叠

回答

相关问题