角度材质滑块无法正确渲染

Question

我无法正确渲染Angular Material Slider。我的代码如下：

    <div class="row formField" ng-cloak>
    <div class="col-md-2">
        <div>送貨日期</div>
        <div>Delivery Date</div>
    </div>
    <md-datepicker ng-model="myDate" md-placeholder="Enter date"></md-datepicker>
</div>
<div class="row formField" ng-cloak>
    <div class="col-md-2">
        <div>進食時間</div>
        <div>Serving Time</div>
    </div>
 <md-content class="md-padding overflow-hidden">
<md-slider-container>
  <span>R</span>
  <md-slider flex="" min="0" max="255" ng-model="color.red" aria-label="red" id="red-slider">
  </md-slider>
  <md-input-container>
    <input flex="" type="number" ng-model="color.red" aria-label="red" aria-controls="red-slider">
  </md-input-container>
</md-slider-container>
</md-content>
</div>

但结果如下，这远非好。

奇怪的是，datepicker工作正常，而滑块不是。感谢您提供任何指导。

Answer 1

看起来滑块无法看到angular-material.css。

<link rel="stylesheet" type="text/css" href="path/to/angular-material.css">

Answer 2

对于Angular Material 2，我直接包含主题CDN链接：

<link href="https://unpkg.com/@angular/material@2.0.0-beta.8/prebuilt-themes/deeppurple-amber.css" rel="stylesheet">