AngularJS의 라디오 버튼에 대해 ng-model이 작동하지 않습니다.
저는 Angular를 처음 사용하고 사용자가 ng-model을 사용하여 선택한 라디오 버튼의 값을 얻으려고합니다. 하지만 "선택된 연락처"에서 출력이 나오지 않습니다.
내 HTML은 다음과 같습니다.
<!doctype html>
<html ng-app>
<head>
<script src="http://code.angularjs.org/1.2.0rc1/angular.min.js"></script>
<script src="script.js"></script>
</head>
<body>
<form name="myForm" ng-controller="Ctrl">
<table border="0">
<th>Contact Type</th>
<tr ng-repeat="contact in contacttype"><td>
<input type="radio" ng-model="contactname" name="group1" value="{{contact.name}}">{{contact.name}}
</td>
</td></tr></table>
<tt>selected contact = {{contactname}}</tt><br/>
</form>
</body>
</html>
아래는 내 main.js입니다.
function Ctrl($scope) {
$scope.contacttype = [
{name: 'Both' },
{name: 'User'},
{name: 'Admin'}
];
}
내가 여기서 뭘 잘못하고 있니? 알아낼 수 없습니다 !!!
때문에 ng-repeat
자신의 영역을 만들고 당신이 일을하려고하는 것은 아이의 범위에서 부모 범위에 값을 할당합니다. 그래서 당신은 할 수 있습니다
<input type="radio" ng-model="$parent.contactname" name="group1" value="{{contact.name}}">
그래서 나는 똑같은 문제가 있었고 ng-model과 함께 $ parent를 사용하는 것이 작동하지 않는 것처럼 보입니다. 내 문제는 확인란 그룹이 있지만 각 확인란에 대해 동일한 이름 속성을 사용한다는 것입니다. 마지막 그룹에서 기본적으로 선택된 라디오 버튼을 숨기는 결과가 나왔습니다.
각 구별 그룹에 대해 구별 이름 속성을 사용하고 있는지 확인하십시오.
var app = angular.module('myApp', []);
app.controller('formCtrl', function($scope) {
$scope.devices = [{
nameD: "Device 1"
}, {
nameD: "Device 2"
}, {
nameD: "Device 3"
}, {
nameD: "Device 4"
}];
});
<!DOCTYPE html>
<html>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<script src="app-controller-r.js"></script>
<body>
<div ng-app="myApp" ng-controller="formCtrl">
<form>
<ul>
<li ng-repeat="device in devices">
<label>{{device.nameD}}
<input type="radio" ng-model="$parent.deviceType" value="{{device.nameD}}" />
</label>
</li>
</ul>
<button>Submit</button>
</form>
{{deviceType}}
</div>
</body>
</html>
if you are using the directive multiple times and you are using the for
and id
with labels ... Make sure to use a reference to the scope's $id
<li ng-repeat='add_type in types'>
<input id="addtester_{{ add_type.k }}_{{ $parent.$id }}" type="radio" ng-model="$parent.addType" ng-value='add_type.k' class="tb-form__input--custom" /
<label for="addtester_{{ add_type.k }}_{{ $parent.$id }}">{{ add_type.v }}</label>
</li>
Otherwise you will have been directives sharing the same inputs and make it possibly appear as if not working.
참고URL : https://stackoverflow.com/questions/18594196/ng-model-not-working-for-radio-button-in-angularjs
'Programing' 카테고리의 다른 글
Eloquent 모델에서 메서드를 호출 할 때 '비 정적 메서드를 정적으로 호출해서는 안됩니다'라는 메시지가 나타나는 이유는 무엇입니까? (0) | 2020.11.21 |
---|---|
ViewPager의 상위 Fragment가 숨겨져 표시되면 ViewPager의 Fragment의 뷰가 손실 됨 (0) | 2020.11.21 |
CSS flex, 첫 번째 줄에 하나의 항목을 표시하고 다음 줄에 두 개의 항목을 표시하는 방법 (0) | 2020.11.21 |
MongoDB 및 Mongoose에서 전체 텍스트 검색을 수행하는 가장 좋은 방법 (0) | 2020.11.21 |
비트 프로그래밍에서 (숫자 및-숫자)는 무엇을 의미합니까? (0) | 2020.11.21 |