Как связать переключатель и флажок одновременно в angularJs?

Я пробовал, что, если я поставлю флажок, тогда будет выбран переключатель. Это хорошо, когда я устанавливаю флажок.Как связать переключатель и флажок одновременно в angularJs?

Но, если я выбираю процесс привязки переключателя, это не происходит. i.e, Если я нажимаю на переключатель, флажок должен быть установлен.

Я не знаю, как это сделать?

Здесь размещен код.

<!DOCTYPE html> 
<html lang="en-US"> 
<head> 
<title>Learn It HTML Template</title> 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.2/angular.min.js"></script> 
</head> 
<body ng-app="sampleApp"> 
<div ng-controller="sampleController"> 
Are you going for party tonight: <input type="checkbox" ng-checked="checked" ng-model="checked"> 
<br/> <br/> 
You should go, Complete this example and rest examples you can learn tomorrow :), So click on the check box above: 
<br/> <br/> 
<input id="checkSlave" type="radio" ng-checked="checked">Yeah :) 

</div> 
<script> 
var app = angular.module("sampleApp", []); 
app.controller('sampleController', ['$scope', function ($scope) { 
$scope.checked= 0; 
}]); 
</script> 
</body> 
</html>

Может ли кто-нибудь помочь в этом?

источник

2016-11-18 Idris

Попробуйте

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.2/angular.min.js"></script> 
 
<script> 
 
var app = angular.module("sampleApp", []); 
 
app.controller('sampleController', ['$scope', function ($scope) { 
 

 

 
}]); \t \t 
 
</script> 
 
<body ng-app="sampleApp"> 
 
<div ng-controller="sampleController" ng-init="checked='false'"> 
 
Are you going for party tonight: <input type="checkbox" ng-checked="checked" ng-click="checked = !checked"> 
 
<br/> <br/> 
 
You should go, Complete this example and rest examples you can learn tomorrow :), So click on the check box above: 
 
<br/> <br/> 
 
<input id="checkSlave" type="radio" ng-checked="checked" ng-click="checked = !checked">Yeah :) 
 
</div>

источник

2016-11-18 07:15:24

Не работает. Теперь, если я сниму флажок, переключатель остается включенным. @priya – Idris

Просто проверьте сейчас. Я только что обновил его. –

Это лучший подход для этого сценария! Должен быть принят ответ –

Здесь вы не указали два способа связывания директивы т.е. нг-модель для радио-кнопки.

<input id="checkSlave" type="radio" ng-checked="checked" ng-model="checked">Yeah :)

источник

2016-11-18 07:28:46

Вы могли бы сделать что-то подобное, это, безусловно, работать

<!DOCTYPE html> 
 
<html lang="en-US"> 
 
<head> 
 
<title>Learn It HTML Template</title> 
 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.2/angular.min.js"></script> 
 
</head> 
 
<body ng-app="sampleApp"> 
 
<div ng-controller="sampleController"> 
 
Are you going for party tonight: <input type="checkbox" ng-checked="slave" ng-model="checked"> 
 
<br/> <br/> 
 
You should go, Complete this example and rest examples you can learn tomorrow :), So click on the check box above: 
 
<br/> <br/> 
 
<input id="checkSlave" type="radio" ng-checked="checked" ng-click="slave=true">Yeah :) 
 

 
</div> 
 
<script> 
 
var app = angular.module("sampleApp", []); 
 
app.controller('sampleController', ['$scope', function ($scope) { 
 
$scope.checked= false; 
 
$scope.slave=false; 
 
}]); 
 
</script> 
 
</body> 
 
</html>

я ввел еще одну переменную, которая будет изменяться по нажатию кнопки радио, потому что событие, которое активируется с помощью переключателя, это не событие проверки, а событие onclick.

источник

2016-11-18 07:32:41 GraveyardQueen

Попробуйте это Сработало хорошо ..!

<!DOCTYPE html> 
<html lang="en-US"> 
<head> 
<title>Learn It HTML Template</title> 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.2/angular.min.js"></script> 
</head> 
<body ng-app="sampleApp"> 
<div ng-controller="sampleController"> 
Are you going for party tonight: <input type="checkbox" ng-checked="checked" ng-click="toggleSwitch()"> 
<br/> <br/> 
You should go, Complete this example and rest examples you can learn tomorrow :), So click on the check box above: 
<br/> <br/> 
<input id="checkSlave" type="radio" ng-checked="checked" ng-click="toggleSwitch()">Yeah :) 

</div> 
<script> 
var app = angular.module("sampleApp", []); 
app.controller('sampleController', ['$scope', function ($scope) { 
$scope.checked= false; 

$scope.toggleSwitch=function(){ 
$scope.checked= !$scope.checked; 
} 
}]); 
</script> 
</body> 
</html> 
</html>

источник

2016-11-18 07:48:53 jeeva

Его работа .. Я хочу проверить с помощью ng-model – Idris

Как связать переключатель и флажок одновременно в angularJs?

ответ

Смежные вопросы