要使Angular Material SlideToggle具有滑动效果,你需要确保正确设置了CSS样式和动画。
以下是一种可能的解决方法:
Toggle
.custom-slide-toggle .mat-slide-toggle-bar {
transition: transform 0.2s;
}
.custom-slide-toggle .mat-slide-toggle-thumb {
transition: transform 0.2s;
}
.custom-slide-toggle .mat-slide-toggle-thumb:not(.mat-checked),
.custom-slide-toggle .mat-slide-toggle-bar {
transition-timing-function: cubic-bezier(0.42, 0, 0.58, 1);
}
.custom-slide-toggle .mat-slide-toggle-thumb.mat-checked {
transform: translateX(16px);
}
以上代码会为SlideToggle添加一个滑动的动画效果。你可以根据需要调整动画的持续时间、缓动函数和样式。
请注意,SlideToggle的滑动效果取决于正确设置了CSS和动画,并且在应用中没有其他的样式或脚本干扰了它的效果。