AngularJS: model ng niewiążący z ng-sprawdzony dla pól wyboru

Odwołałem się do tego przed zadaniem tego pytania.AngularJS: model ng niewiążący z ng-sprawdzony dla pól wyboru

AngularJs doesn't bind ng-checked with ng-model

Jeśli ng-checked jest oceniany na true na stronie html The ng-model nie jest aktualizowana. Nie mogę ng-repeat zasugerować w powyższym pytaniu, ponieważ muszę użyć jakiejś stylizacji dla każdego pola wyboru.

Oto plunker, który stworzyłem, aby zilustrować mój problem.

http://plnkr.co/edit/YsOsPh3vjkPMUUDa6r2t

Aby zobaczyć, co chcę, proszę otworzyć konsolę, i po prostu kliknij na Submit przycisku. Proszę nie zaznaczać żadnych pól wyboru.

Z góry dziękuję!

Źródło

2013-05-17 Abilash

107

ngModel i ngChecked nie są przeznaczone do użytku łącznie.

ngChecked spodziewa się wyrażenia, więc mówiąc: ng-checked="true", zasadniczo mówisz, że pole wyboru będzie zawsze domyślnie zaznaczone.

Powinieneś być w stanie po prostu użyć ngModel, przywiązanego do właściwości boolowskiej w twoim modelu. Jeśli chcesz czegoś innego, musisz użyć ngTrueValue i ngFalseValue (która obsługuje teraz tylko łańcuchy) lub napisać własną dyrektywę.

Co dokładnie próbujesz zrobić? Jeśli chcesz, aby pierwsze pole wyboru było zaznaczone domyślnie, powinieneś zmienić swój model - item1: true,.

Edytuj: Nie musisz przesyłać formularza do debugowania bieżącego stanu modelu, btw, możesz po prostu zrzucić {{testModel}} do swojego HTML (lub <pre>{{testModel|json}}</pre>). Również atrybuty ngModel można uprościć do ng-model="testModel.item1".

http://plnkr.co/edit/HtdOok8aieBjT5GFZOb3?p=preview

Źródło

2013-05-17 03:52:19 Langdon

'ng-checked' jest obliczana na prawdziwe przez wyrażenie.Aby wskazać, że 'ng-model' nie jest połączony, użyłem tam prawdziwego. Podczas inicjowania kontrolera chcę, aby wszystkie pola wyboru były odznaczone. Po zapytaniu ajaxowym obliczam wartość 'ng-checked', aby zaznaczyć pole wyboru. To jest, gdy mój 'ng-model' nie jest aktualizacją. – Abilash

@Abilash Nie powinieneś używać 'ngChecked'. Twój model jest w porządku, wystarczy ustawić 'testModel.item1 = true' w twoim wywołaniu ajax, a następnie wywołać' $ scope. $ Apply() ', aby zaktualizować swój widok. – Langdon

Właśnie popełniliśmy błąd polegający na użyciu 'ng-checked' zamiast" ng-model "... nigdy więcej! – g00glen00b

Można użyć NG-value-prawdziwe powiedzieć, że ng kanciasty model jest ciągiem.

mogę dostać NG-prawdziwa wartość pracy jeśli dodałem dodatkowe cytaty jak tak (jak pokazano w oficjalnych kątowe docs - https://docs.angularjs.org/api/ng/input/input%5Bcheckbox%5D) tylko

ng-true-value="'1'"

Źródło

2015-04-07 11:08:49 JRT

Co można zrobić, to użyć ng-repeat przekazując wartość cokolwiek robisz iteracja na ng-checked i stamtąd wykorzystując ng-class do zastosowania stylów w zależności od wyniku.

Zrobiłem coś podobnego niedawno i zadziałało to dla mnie.

Źródło

2016-08-18 12:51:08 Scott

może zadeklarować Ponieważ w ng-Init także coraz prawdziwe

<!doctype html> 
<html ng-app="plunker" > 
    <head> 
    <meta charset="utf-8"> 
    <title>AngularJS Plunker</title> 
    <script>document.write('<base href="' + document.location + '" />');</script> 
    <link rel="stylesheet" href="style.css"> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.6/angular.js"></script> 
    <script src="app.js"></script> 
    </head> 
    <body ng-controller="MainCtrl" ng-init="testModel['item1']= true"> 
    <label><input type="checkbox" name="test" ng-model="testModel['item1']" /> Testing</label><br /> 
    <label><input type="checkbox" name="test" ng-model="testModel['item2']" /> Testing 2</label><br /> 
    <label><input type="checkbox" name="test" ng-model="testModel['item3']" /> Testing 3</label><br /> 
    <input type="button" ng-click="submit()" value="Submit" /> 
    </body> 
</html>

można wybrać pierwszy i obiekt pokazany tu również prawdziwe, fałszywe, flase

Źródło

2016-12-07 10:14:53

AngularJS: model ng niewiążący z ng-sprawdzony dla pól wyboru

Odpowiedz

Powiązane problemy