반응형
식이 포함된 AngularJsng-disabled 지시문이 작동하지 않습니다.
User Story: 새 사용자가 New User 확인란을 클릭하고 약관 라디오 버튼을 수락하면 Register(등록) 버튼을 활성화해야 합니다.
각진 내 코드JS가 안 돼요.Register(등록) 버튼은 비활성화된 상태로 유지됩니다.뭐가 잘못됐나요?
<!DOCTYPE html>
<html ng-app>
<head>
<script src="lib/angular/angular.min.js"></script>
</head>
<body>
<div ng-controller="LoginCtrl">
<div>
<label>New User?</label>
<input type="checkbox" ng-model="isNewUser"/>
</div>
<div ng-show="isNewUser">
<label>Accept Terms and Conditions</label>
<input type="radio" value="yes" name="tnc" ng-model="tnc"/><label>Yes</label>
<input type="radio" value="no" name="tnc" ng-model="tnc" /><label>No</label>
</div>
<div>
<input type="submit" value="Login" ng-disabled="isNewUser" >
<input type="submit" value="Register" ng-show="isNewUser" ng-disabled="hasAcceptedTnC('{{tnc}}')">
</div>
</div>
</body>
<script language="JavaScript">
var LoginCtrl = function ($scope) {
$scope.isNewUser = false;
$scope.tnc = "no";
$scope.hasAcceptedTnC = function(value) {
//alert(value);
return "yes"==value;
};
}
</script>
</html>
그ng-disabled표현은 현재 범위에서 평가됩니다.따라서, 당신은 다음과 같은 것만 필요합니다. 추가적인 interpolation은 필요 없습니다.{{..}}:
<input type="submit"
value="Register"
ng-show="isNewUser"
ng-disabled="!hasAcceptedTnC(tnc)">
참고로 제가 추가한 것은!사용자가 TnC를 수락하지 않은 경우 버튼을 비활성화하기를 원할 수 있습니다.
작업 데모: http://plnkr.co/edit/95UiO4Rd2IMh8T1KjSQK?p=preview
사용 시기에 대한 추론 방법을 묻는 댓글이 아래에 게시되었습니다.{{...}}그리고 주어진 표현과 함께 맨 표현을 사용할 때.ng-*지시의유감스럽게도 지시문에는 그 정보를 밝힐 수 있는 구문상의 단서가 숨겨져 있지 않습니다.설명서를 보는 것이 이 정보를 알아내는 가장 빠른 방법이 될 것입니다.
if ($scope.Data.length > 0)
$scope.isNewUser = true;
else $scope.isNewUser = false;
<md-button class="md-raised md-primary"
ng-click="Search()"
ng-disabled="!isNewUser"
aria-label="pause">Assign </md-button>
위의 솔루션에서 도움을 받아보려 했으나 효과가 없었습니다.그래서 다른 해결책을 찾았습니다.해당 요소에 대한 CSS에 다음 코드를 추가하여 문제 포인터 이벤트를 해결합니다. 없음;
그래서 일반적으로 :-
element[disabled]{
pointer-events: none;
}
언급URL : https://stackoverflow.com/questions/20518691/angularjs-ng-disabled-directive-with-expression-is-not-working
반응형
'codememo' 카테고리의 다른 글
| 그리드 보기 코드별 열 숨기기 (0) | 2023.11.04 |
|---|---|
| Xcode의 iPad 옵션 대상 (0) | 2023.11.04 |
| 디바의 내용을 이미지로 저장하는 방법? (0) | 2023.11.04 |
| 도커 이미지 이름에서 알파인, 제시, 스트레치, 버스터의 차이점은 무엇입니까? (0) | 2023.11.04 |
| 모듈을 찾을 수 없음: 오류:'fs' 오류를 해결할 수 없음 - 해결됨 (0) | 2023.11.04 |