2016-12-03 27 views
0

在我的应用程序中,我已将离子切换设置为来自json数组的电话号码列表。我在这里面临的问题是,当选择特定数字的切换时,所有切换都被选中并设置为真。所以我无法在警报中显示选定的电话号码。我需要的是选择多个电话并在警报中列出选定的电话号码。显示当离子切换为真时选择的值

控制器:

$scope.notify = function() { 
     alert($scope.adminAccess.checked); 
    } 

    $scope.adminAccess={checked:true}; 
}); 

HTML:

<ion-list> 
      <ion-toggle ng-model="adminAccess.checked" ng-repeat="numbers in phoneList" toggle-class="toggle-positive"> 
       {{numbers.userId}} 
      </ion-toggle> 
+0

您正在对ng-repeat应用adminAccess.checked,这意味着相同的模型将传递给每个切换,因此每个切换都会被选中。 –

回答

0

您需要使用NG-模型number.admin_access

var carService = angular.module('carService', ['ionic']) 
 
carService.controller('carBrand', ['$scope', function($scope) { 
 
    $scope.phoneList = [{ 
 
    "userId": 1, 
 
    "admin_access": false, 
 
    "number": "123" 
 
    }, { 
 
    "userId": 2, 
 
    "admin_access": true, 
 
    "number": "456" 
 
    }, { 
 
    "userId": 3, 
 
    "admin_access": false, 
 
    "number": "789" 
 
    }]; 
 
    
 
    $scope.notify = function(number){ 
 
    alert(number.admin_access); 
 
    } 
 

 
}]);
<!DOCTYPE html> 
 
<html ng-app='carService'> 
 
<head> 
 
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"> 
 
    <title></title> 
 
    <link rel="stylesheet" href="style.css"> 
 
    <link rel="stylesheet" type="text/css" href="http://code.ionicframework.com/1.0.0-beta.11/css/ionic.min.css"> 
 
    <script src="//code.ionicframework.com/1.0.0-beta.9/js/ionic.bundle.min.js"></script> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script> 
 
    <script src="script.js"></script> 
 
</head> 
 
<body ng-controller="carBrand"> 
 
    <ion-view view-title="Car Type"> 
 
    <ion-content ng-contorller="carBrand"> 
 
     <ion-toggle ng-model="number.admin_access" ng-change="notify(number)" ng-repeat="numbers in phoneList" toggle-class="toggle-positive"> 
 
     {{numbers.userId}} 
 
     </ion-toggle> 
 
    </ion-content> 
 
    </ion-view> 
 
</body> 
 

 
</html>

0

你正在对ng-repeat应用adminAccess.checked,这意味着相同的模型将传递给每个切换,因此每个切换都将被选中。

你需要传递adminAccess对象的数组等于你PHONELIST(我认为会更好,如果包含在PHONELIST)

在控制器:

//Add adminAccess attribute in $scope.phoneList like this 
$scope.phoneList = [{'userId':'133sf', adminAccess:{checked:true}, ...},{'userId':'133sf', adminAccess:{checked:true}, ...}, ....] 

$scope.notify = function (obj) { 
      alert(obj.adminAccess.checked); 
} 

在HTML:

<ion-toggle ng-model="number.adminAccess.checked" ng-repeat="number in phoneList" ng-change="notify(number)" toggle-class="toggle-positive"> 
{{numbers.userId}} 
</ion-toggle> 
相关问题