2015-07-21 87 views
1

我在AngoloJS中使用Ionic & Cordova環境。我在切換樣式中有一個複選框 - 通過該複選框,用戶可以激活或停用將通過XHR-Request保存在數據庫中的選項。AngularJS複選框僅適用於false> true,對於false> true case我必須單擊複選框兩次

案例1: 複選框被激活。我點擊它 - 切換切換到假,但值保持真實。我必須再次點擊它兩次(切換回真,然後再次爲假)>現在值更改爲假。

案例2: 複選框被禁用。我點擊它 - 切換爲真,值切換爲真,一切都很好。即使我切換回false,它也可以直接使用。

所以:爲什麼我的複選框必須檢查爲真,然後才能檢查返回值爲false?!

HTML/VIEW:

<input type="checkbox" ng-model="setTrackOption110" ng-checked="isChecked110()" ng-change="stateChanged110(setTrackOption110)" /> 

控制器,第1部分 - 從DB檢查狀態(工作沒有任何問題):

$http({ 
      method: 'GET', 
      url: 'http://***&do=get&optid=110&userId=' + fdappAuth.fdappUserId + '&userPwHash=' + fdappAuth.fdappUserPw, 
      headers: { 
       'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8' 
      } 
     }) 
      .success(function (data, status) { 
       // Verarbeitet die Daten und setzt diese zur Anzeige in die scopes 
       console.log("Optionsabfrage für Option 110 läuft"); 

       $scope.optentry = data[0]; 
       console.log("Rueckgabe JSON:"); 
       console.log($scope.optentry); 

       $scope.optentry.opt_110 = data[0].opt_110; 
       console.log("Optionswert:"); 
       console.log($scope.optentry.opt_110); 

       if ($scope.optentry.opt_110 == 1) { 
        $scope.isChecked110 = function() { 
         // return true or false 
         return true; 
        }; 
       } else { 
        $scope.isChecked110 = function() { 
         // return true or false 
         return false; 
        }; 
       } 
      }); 

控制器,第2部分 - 安全的新值(這裏是問題):

// START OPTION 110 - TRACK & SHARE 
     // Liest aus, ob der Wert geändert wird - wenn ja, wird die jeweilige Aktion ausgeführt 
     $scope.stateChanged110 = function (checked) { 
      console.log("STATUSÄNDERUNG || Neuer Status: checked: " + checked); 
      if (checked == true) { 

       // Start XHR Request 
       $http({ 
        method: 'GET', 
        url: 'http://*&do=set&optid=110&state=true&userId=' + fdappAuth.fdappUserId + '&userPwHash=' + fdappAuth.fdappUserPw, 
        headers: { 
         'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8' 
        } 
       }) 
        .success(function (data, status) { 
         console.log("api call options erfolgreich"); 
        }); 

      } 
      if (checked == false) { 
       // Start XHR Request 
       $http({ 
        method: 'GET', 
        url: 'http://*&do=set&optid=110&state=false&userId=' + fdappAuth.fdappUserId + '&userPwHash=' + fdappAuth.fdappUserPw, 
        headers: { 
         'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8' 
        } 
       }) 
        .success(function (data, status) { 
         console.log("api call options erfolgreich"); 
        }); 
      } 
     }; 

我甚至有測試anguar.isDefined/isUndefined,或者使用ng-click代替ng-change和其他一些小解決方法。 感謝您的幫助。

+0

**謝謝,它的工作原理!** :) –

回答

1

嘗試初始化$scope.setTrackOption110 = false,主要是它的點/範圍問題

0

基於entry's answer

我已經添加了貼線在我的功能器isChecked:

if ($scope.optentry.opt_110 == 1) { 
        $scope.isChecked110 = function() { 
         // return true or false 
         $scope.setTrackOption110 = true; 
         return true; 
        }; 
       } else { 
        $scope.isChecked110 = function() { 
         // return true or false 
         $scope.setTrackOption110 = false; 
         return false; 
        }; 
       } 
+0

我已經更好地格式化了你的答案。 「謝謝」等噪音是不必要的。當你獲得更多的聲譽時,你應該考慮提高你發現有用的答案,作爲你的感謝。 – ryanyuyu