angular - 是否可以使用 Angular Material 构建图像轮播?

标签 angular angular-material carousel

我正在尝试使用 Angular Material 开发图像轮播,但我找不到任何有用的资源。

我尝试了 https://github.com/gbrlsnchs/material2-carousel但没有用,代码很复杂。

最佳答案

这里是 example为你

<ng-template #slide let-slide>
    <div [ngStyle]="{
      'background-size': 'cover',
      'background-image': 'url(' + slide.url + ')',
      'background-repeat': 'no-repeat',
      'width': '100%',
      'height': '100%'
    }">
    </div>
</ng-template>
<ng-template #thumbnail let-slide>
        <div [ngStyle]="{
        'background-size': 'cover',
        'background-image': 'url(' + slide.url + ')',
        'background-repeat': 'no-repeat',
        'background-position': 'center center',
        'width': '100%',
        'height': '100%'
      }"></div>
</ng-template>

关于angular - 是否可以使用 Angular Material 构建图像轮播?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57817112/

相关文章:

angular - 有条件地应用指令

javascript - 如何动态地为 TypeScript 中的对象数组中的对象添加值?

css - 使用 css backface 属性时 Angular Material 输入字段不起作用

jquery - Bootstrap 轮播 - 移动触摸问题

javascript - 许多 100% 高度/宽度 div - 旋转木马导航?

javascript - 如何使用 jQuery 自定义动画 <ul> 轮播 slider ?

javascript - 如何在angularjs中声明一个函数

angular - 设置时 Material 芯片颜色不起作用

javascript - AngularJS - 根据另一个 md-autocomplete 输入自动更新 md-autocomplete 搜索列表

angular - 如何获取 mat-form-field 内输入的点击事件?