ng-click mit ng-checked nicht update checkbox state

kleine frage (möglich eine logische err), ich versuche, das checkbox zu aktualisieren automatisch nach dem klicken und gleichzeitig mit dem rest api zu PUT die änderungen in DB, und das PUT-Mothod funktioniert, es aktualisiert die DB, aber es aktualisiert nicht den Checkbox-Status selbst nur, wenn ich die Seite aktualisieren, wird das Kontrollkästchen aktualisiert.ng-click mit ng-checked nicht update checkbox state

Und ich habe diese einfache Code:

<input type="checkbox" ng-checked="action.state" ng-click="setState($event, key, action)"><div class="track"><div class="handle"></div></div>

und Back-End wie folgt aus:

.controller('Actions', function ($scope, $filter, $resource, $ionicActionSheet, $ionicModal) { 
    var actionListResource = $resource('/api/actions/'); 

    actionListResource.query(function (data) { 
     $scope.actions = data; 
    }); 

    $scope.setState = function (event, index, action) { 

     if (action.widget === 'toggle' && action.state === 1) { 
      action.state = 0; 
     } 
     else { 
      action.state = 1; 
     } 

     event.preventDefault(); 

     var actionsResource = $resource('/api/actions/:actionId/', {actionId:'@id'}, { 
      'update': { 
       method: 'PUT' 
      } 
     }); 
    }; 
    ...more code here 
})

action.state ist immer ein Wert 1 oder 0, habe ich die $scope.actions[index].state geprüft und it ` s aktualisiert sich selbst, wenn ich das Kontrollkästchen anklicke.

Vielen Dank!

Quelle

2017-01-30 Xao

Verwendung ng-Modell statt ng geprüft das Kontrollkästchen zu aktualisieren. – Ajay

Ich habe es versucht, funktioniert nicht, das Kontrollkästchen wird nicht aktualisiert, wenn ich es anklicke, wird das Ereignis ausgelöst, aber keine Bewegung auf Kontrollkästchen im Front-End – Xao

add plkr oder Geige. –

-2

Probieren Sie ng-model statt ng-checked aus. Das Toggle-Zeug sieht unnötig aus. ng-change könnte auch verwendet werden, um die Anfrage auszulösen. In ihren Dokumenten lösen sie genau das Problem, das Sie beschreiben. https://docs.angularjs.org/api/ng/directive/ngChange

Quelle

2017-01-30 07:47:17 user2498705

Es wäre hilfreich, wenn Sie die Vorteile von 'ng-model' erklären, anstatt nur zu sagen, dass das OP es benutzen soll. * Warum * sollte er das tun und * wie *. –

danke scheint echt, aber ich habe es auch versucht und ich habe einen riesigen eckigen Fehler, ich werde es heute wieder versuchen, ich werde aktualisieren, danke. – Xao

Es gab ein event.preventDefault() - das war es! Ich weiß nicht, wie ich es beschönige! – Xao

<html> 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> 
<body ng-app="myApp"> 

<div ng-controller="myCtrl"> 
    <input type="checkbox" ng-model="action" ng-click="setState()"> 
</div> 

<script> 
angular.module('myApp', []) 
    .controller('myCtrl', ['$scope', function($scope) { 
    $scope.setState = function() { 
     window.alert($scope.action); 
     // $scope.action value will be true or false 
    }; 
    }]); 
</script> 
</body> 
</html>

Quelle

2017-01-30 09:43:42

HI, das hilft überhaupt nicht, in der Tat, ich will etwas ganz anderes. Mein Problem ist nicht, wie dieses Konzept zu verwenden ist, ist das Kontrollkästchen nicht aktiviert oder deaktiviert, wenn ich darauf klicken und setState ändert den Zustand und aktualisiert die DB. – Xao

Bitte sehen Sie dieses Beispiel https://jsfiddle.net/KarthikParameswaran/a6jq1mk7/, Checkbox funktioniert gut für mich. –

ng-click mit ng-checked nicht update checkbox state

Antwort

Verwandte Themen