在較小的屏幕尺寸上使用md-grid-list時出錯

Question

我正在構建一個顯示產品網格列表的移動網站。

爲了實施網格列表，我正在使用角度材料的md-grid-list指令。

這是實現上述功能的我的代碼部分：

<div id="products-row" infinite-scroll="fetchNextPage(nextCategory,1)" infinite-scroll-disabled="busy"> 
    <md-grid-list md-cols-gt-md="3" md-cols-md="2" md-cols-sm="1" md-gutter="5px" md-row-height="2:1"> 
     <md-grid-tile ng-repeat="p in productsOfCurrentCat"> 
      <product data="p" id="product-item"></product> 
     </md-grid-tile> 
     <div ng-show="busy">Loading more products....</div> 
    </md-grid-list> 
</div> 

這工作得很好的更大的屏幕尺寸。當我查看使用谷歌瀏覽器的切換裝置模式下的屏幕尺寸較小的網頁，我得到以下錯誤：

md-grid-list: md-cols attribute was not found, or contained a non-numeric value

而且，它無限地發送請求到節點服務器。

我試圖谷歌它，但沒有足夠的幫助可用。任何幫助在這個論壇將不勝感激。

Answer 1

那麼，錯誤告訴你，你錯過了md-cols適合你選擇的設備的斷點。

如果你看佈局斷點介紹here和網格列表演示here，你會發現，你錯過了md-cols-xs="1"屬性。 sm不是最小的斷點。