簡體   English   中英

Ionic-使用Toggle禁用范圍選擇

[英]Ionic - Disable Range Selection with Toggle

我在制作有關禁用以下范圍選擇腳本的離子應用程序時無法解決我的預期問題:

對於控制器腳本:

.controller('SetDiscount', function($scope) {
    if ( $scope.checkbox = { checked: true }) {
         $scope.disabled = true
    } else {
         $scope.disabled = false
    }
});

對於模板HTML:

<ion-view view-title="Set Discount">
  <div class="bar bar-subheader">

  </div>

  <ion-content class="has-header has-subheader"> 
    <ul class="list">
      <li class="item item-toggle">
          Safe Discount
          <label class="toggle toggle-dark">
            <input type="checkbox" ng-model="checkbox.checked">
            <div class="track">
              <div class="handle"></div>
            </div>
          </label>
      </li>
      <li class="item range range-dark" >
        Discount Amount
        <input type="range" name="volume" min="0" max="100" value="33" ng-model="discount" ng-disabled="disabled">
      </li> 
    </ul>
  </ion-content>
</ion-view>

有什么建議可以像我在此鏈接上的概念一樣做到嗎?

您可以聲明$ scope.disabled = true; 在您的控制器中,並將其用作復選框的ng-model。 在“折扣金額” li標簽上,使用ng-if檢查復選框是否已禁用。 這是一支電筆http://codepen.io/anon/pen/YXVMaK

.controller('MyCtrl', function($scope, $timeout) {
    $scope.myTitle = 'Template';        
    $scope.data = { 'volume' : '5' };      
    $scope.disabled=true;
})

像您所做的那樣,將此登錄直接添加到控制器中就可以在控制器初始化時進行,但在控制器的生命周期內則不能。 而且,由於離子緩存大量頁面,當您返回頁面時,控制器將不會再次初始化。

我建議您將ng-disabled控制器更改為:

ng-disabled="!checkbox.checked"

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM