角度材質2 - 禁用紋波？

我目前正在與MD-標籤組（剛剛更新到昨天最新版本）工作...角度材質2 - 禁用紋波？

有誰知道

如果有可能禁用現有組件/配置紋波（md-tab-group在這種情況下）？最新版本會導致我的標籤頁標題跳轉，因爲紋波正在計算較大的值，解決方案是直接在MdTabGroup的模板中爲md-tab-label添加一個小值用於md-ripple-max-radius。
如果有計劃刪除md-tab-labels的最小寬度？我正在使用一個非常小的選項卡組（寬度僅爲300px），因此160px最小寬度不可用。

謝謝！

來源

2016-12-15 Cleudi

@Alireza張貼您的問題的正確答案。您應該考慮將其標記爲答案。 – mtpultz

我想出了兩種方法來覆蓋基於另一篇文章的MD風格。對於小標籤組中的標籤太寬，我也遇到了同樣的問題。它仍然是非常實驗性的，可能需要進一步的解釋，但它對我有效。

薩斯

首先解決造型

您可以使用/深/在上課前您要覆蓋

/* your-component.component.scss file*/ 
 

 
/deep/ .md-tab-label { 
 
    min-width: 0px; /* Or whatever value you wish */ 
 
    /* In some situations !important seems necessary */ 
 
}

<!-- your-component.component.html --> 
 
<!-- Template from Angular Material's Github Readme.md --> 
 
<md-tab-group> 
 
    <md-tab> 
 
    <template md-tab-label> 
 
     The <em>best</em> pasta 
 
    </template> 
 
    <h1>Best pasta restaurants</h1> 
 
    <p>...</p> 
 
    </md-tab> 
 
    <md-tab> 
 
    <template md-tab-label> 
 
     <md-icon>thumb_down</md-icon> The worst sushi 
 
    </template> 
 
    <h1>Terrible sushi restaurants</h1> 
 
    <p>...</p> 
 
    </md-tab> 
 
</md-tab-group>

與純CSS解決方法二

創建overrides.css文件，你在你的主的index.html鏈接，然後覆蓋材料類此

/* overrides.css */ 
 
.md-tab-label ,.md-tab-label-active { 
 
    min-width: 0; /* same comments as the first solution */ 
 
}

<!-- index.html --> 
 
<link rel="stylesheet" content="text/css" href="overrides.css">

兩者都有點骯髒，但第一個爲我提供了一個很好的解決方案來覆蓋一個MD組件的風格，保持有關組件內部的變化（考慮只包裝本地組件的變化）。

來源

2016-12-25 21:24:36

使用disableRipple作爲禁用使用Angular材質的Angular2 +的md-tab-group漣漪的屬性。

只需簡單地做這樣的事情：

<md-tab-group disableRipple></md-tab-group>

來源

2017-06-15 04:37:17 Alireza

角度材質2 - 禁用紋波？

回答

相關問題