Ionic - So erhalten Sie ausgewählte Artikel in Ionic Kontrollkästchen

Ich möchte ausgewählte Artikel in Ionic Checkboxen erhalten. Also, wenn Benutzer Checkbox (s), ich möchte wissen, welche Bücher er/sie ausgewählt hat.Ionic - So erhalten Sie ausgewählte Artikel in Ionic Kontrollkästchen

Hier sind meine Code-Schnipsel:

 <ion-item ng-repeat="book in data.books"> 

       <div style="margin-left:110px;margin-right:10px;"> 
        {{book.name}} 
       </div> 

       <li class="item item-checkbox checkbox-balanced"> 

        <label class="checkbox"> 
         <input type="checkbox"> 
        </label> 
       </li> 

      </ion-item>

wenn der Code ausgeführt, es sieht wie folgt aus:

I Verwendung ng-Modell will, aber ich weiß nicht, wie zu verwenden es. Kann mir bitte jemand helfen, da ich Ionic und AngularJS neu bin, DANKE!

UPDATE: Ich bin sehr traurig, dass ich nicht den Controller-Code-Schnipsel vorsah, hier sind die Codes:

.controller('DetailsCtrl', function ($scope, $http) { 
$http.get("") // some webservice url 
    .then(function (response) { 
     $scope.data = response.data; 
    }); 
});

Quelle

2017-02-11 Antoni

Sie eine Variable für checked in jedem Wert und binden haben kann, die als model variable dem Kontrollkästchen

DEMO

var clubApp = angular.module('clubApp', ['ionic']) 
 
clubApp.controller('ctrlPlayer', ['$scope', function($scope) { 
 
    $scope.books = [{ 
 
    "name": "And the goog news is", 
 
    "checked": false 
 
    }, { 
 
    "name": "Girl on the train", 
 
    "checked": false 
 
    }]; 
 
$scope.getselected = function(){ 
 
    angular.forEach($scope.books,function(key,value){ 
 
     if(key.checked ==true) 
 
     { 
 
      alert(key.name); 
 
     } 
 
    }); 
 
} 
 

 
}]);

<!DOCTYPE html> 
 
<html ng-app='clubApp'> 
 
<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="//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="//ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script> 
 
    <script src="//cdnjs.cloudflare.com/ajax/libs/angular-filter/0.5.4/angular-filter.min.js"></script> 
 

 
    <script src="script.js"></script> 
 
</head> 
 
<body ng-controller="ctrlPlayer"> 
 
<ion-list> 
 
    <ion-checkbox ng-model=value.checked ng-repeat="(key, value) in books"> 
 
    <span>{{value.name}}</span> 
 
    </ion-checkbox> 
 
</ion-list> 
 
<button ng-click="getselected()" class="button button-positive"> 
 
      get selected 
 
</button> 
 
    <h1>{{selectedval}}</h1> 
 
</body> 
 

 
</html>

Quelle

2017-02-11 07:10:56 Sajeetharan

Hallo, danke für die Antwort. Es tut mir sehr leid, dass ich den Code des Controllers nicht zur Verfügung gestellt habe. Es ist mein Fehler. Es tut mir leid. Ich habe die Frage mit dem Label "UPDATE" aktualisiert. Kannst du bitte einen Blick darauf werfen? Danke Sajeetharan – Antoni

Es ist okay. Ich habe bereits die Lösung gefunden :) Danke :) – Antoni

@Antoni als Antwort markieren, wenn es geholfen hat – Sajeetharan

Ionic - So erhalten Sie ausgewählte Artikel in Ionic Kontrollkästchen

Antwort

Verwandte Themen