md-sliderはng-repeatで動作していませんか？

Question

md-sliderでng-repeatのスライダでデータを取得できません

ng-repeatで使用していて、値の上端が表示されない場合は、スライダのギャップもあります。

$scope.data = [ 
 
{ 
 
    id: 1, 
 
    value: "1" 
 
}, 
 
{ 
 
    id: 2, 
 
    value: "2" 
 
}, 
 
{ 
 
    id: 3, 
 
    value: "3" 
 
} 
 
    ] 
 
console.log($scope.data); 
 
    $scope.clicked = function (id) { 
 

 
     alert(id); 
 
    };

<md-slider-container> 
 
     <md-slider flex ng-model="value" ng-repeat="aa in data" aria- 
 
     label="blue" id="blue-slider" class="md-primary"> 
 
      {{aa.value}} 
 
     </md-slider> 
 
     <md-input-container> 
 
      <input flex type="number" ng-model="value" aria-label="blue" 
 
       aria-controls="blue-slider"> 
 
     </md-input-container> 
 
    </md-slider-container> 
 
    <md-button class="md-raised md-primary" ng-click=clicked(value)>Get 
 
    Value</md-button>

Answer 1

あなたは間違ったマークアップを使用しています。試してみてください：

<md-content> 
     <md-slider-container ng-repeat="aa in data"> 
     <span>{{aa.value }}</span> 
     <md-slider flex ng-model="color.green" min="0" max="255" aria-label="green" id="green-slider" class="md-accent"> 
     </md-slider> 
     <md-input-container> 
     <input flex type="number" ng-model="color.green" aria-label="green" aria-controls="green-slider"> 
     </md-input-container> 
    </md-slider-container> 


    </md-content>