水平テキストカルーセルを作成する方法

Question

この質問は愚かな疑問に思えるかもしれません。しかし、私は本当にそれに固執しています。

センタータイトルの上にある説明文の下にカルーセルを作成しようとしています。 googleにはたくさんの例がありますが、適切なものは何も見つかりませんでした。

1. 私はangular-materialを使用していますし、今までangular-materialに実装何らカルーセルはありません。
2. materializecssにはすばらしいカルーセルがありますが、角度材料と材料のために要素CSSのプロジェクトロットにマテリアライズを追加しています。
3. 私はJKカルーセルのような他のディレクティブを使用することに決めました。画像上にテキストを作成することはできません。
4. ui.bootstrapにカルーセルがあり、ドロップダウンコンポーネントと競合しています。

どのように私の要件を達成することができます教えてください？ angular-materialを使用する必要があります。他に選択肢はありません。したがって、角材料を使用しているすべてのヘルプは、大きなサポートになります。

Answer 1

私は角度材料プロジェクトで現在​​を使用しています。それはhtmlスライド版を持っています。あなたはそのスライドhtmlですべての角度の材料のクラスを構築することができます。

<carousel3d-slide ng-repeat="slide in app.slides2 track by $index" ng-style="{'background': slide.bg}"> 
    <div style="padding: 20px; color: #fff"> 
     <md-card md-theme="{{ showDarkTheme ? 'dark-grey' : 'default' }}" md-theme-watch> 
      <md-card-title> 
       <md-card-title-text> 
        <span class="md-headline">Card with image</span> 
        <span class="md-subhead">Large</span> 
       </md-card-title-text> 
       <md-card-title-media> 
        <div class="md-media-lg card-media"></div> 
       </md-card-title-media> 
      </md-card-title> 
      <md-card-actions layout="row" layout-align="end center"> 
       <md-button>Action 1</md-button> 
       <md-button>Action 2</md-button> 
      </md-card-actions> 
     </md-card> 
    </div> 
</carousel3d-slide>