角度/角度材質：替換HTML滑塊不會更新其ng模型

$scope.$watch("checkbox", function(newVal, oldVal, scope) { 
    var newmax = calcNewMax(); 
    var slider = angular.element(document.querySelector("#slider")); 
    var parent = slider.parent(); 
    slider.remove(); 
    var newSlider = '<md-slider id="slider" flex="100" class="md-warn" md-discrete ng-model="size" step="10" min="100" max="' + newmax + '" aria-label="rating"> </md-slider>'; 
    parent.prepend($compile(newSlider)($rootScope)); 
    $scope.size = 500; 
       });

我正在使用角度材質的md-slider。我真正想要的是通過複選框更新基於用戶選擇的滑塊的最大值。我第一次嘗試爲max屬性設置一個新值並不起作用（對aria-valuemax也不起作用）。角度/角度材質：替換HTML滑塊不會更新其ng模型

因此，我決定刪除完整的滑塊並將其替換。上面的代碼有效。

但什麼不起作用的是，當我添加新的滑塊，ng-model，這是綁定到$scope.size似乎不再同步（我有一個標籤綁定到該值，它不會更新）。當然$apply()不起作用，因爲我已經在$watch。

來源

2016-11-17 faboolous

我試圖做你在你的第一次嘗試想要的東西，而且它的工作原理：

<md-slider step="1" md-discrete min="0" max="{{max}}" ng-model="value"></md-slider> 
<md-checkbox ng-model="max" ng-true-value="20" ng-false-value="{{baseMax}}"> 
     max 20 
</md-checkbox> 
<md-checkbox ng-model="max" ng-true-value="40" ng-false-value="{{baseMax}}"> 
     max 40 
</md-checkbox> 
<md-checkbox ng-model="max" ng-true-value="60" ng-false-value="{{baseMax}}"> 
     max 60 
</md-checkbox>

請看一看這個plunker，並與您的解決方案 https://plnkr.co/edit/BAM5ToIzZDUoqWPcQlWA?p=preview

來源

2016-11-18 06:23:04

真棒@Patryk，我的失誤比較是通過'.attr（「max」，newmax）'添加最大值，它沒有發生在我身上我可以直接使用角度:)謝謝！ – faboolous

角度/角度材質：替換HTML滑塊不會更新其ng模型

回答

相關問題