반응형
AngularJS : 설치 및 서버 응답 사이의 모든 양식 제어 사용 안함
사용자가 사용하지 않는 "저장"또는 "제복"버튼을 클릭하는 동안 양식 컨트롤을 최소한으로 사용자 상호 작용에 사용할 수 없게 만들려면 가장 좋은 방법에 있습니다. 그리고 와이어를 통해 이동하는 데이터. JQuery (악한 !!!)를 사용하고 싶지 않고 모든 요소를 배열 (클래스 또는 속성 마커별로)로 쿼리하고 싶지 않습니다. 지금까지의 아이디어는 다음과 가변적입니다.
cm-form-control
"data-sent"및 "data-processed"라는 두 가지 알림을 구독 할 사용자 지정 지시문으로 모든 요소를 표시하십시오 . 그런 다음 사용자 정의 코드는 두 번째 알림을 푸시하거나 약속을 해결합니다.- 사용
promiseTracker
(불확실하게!) 그를 적용하여 같은 코드를 생성하는ng-show="loadingTracker.active()"
. 분명히 모든 요소가있는 것은ng-disabled
사용자ng-hide/show
가 "춤추는"버튼을 사용하기를 사용합니다 . - 총알을 물고 여전히 JQuery를 사용
더 좋은 아이디어가 있습니까? 미리 감사드립니다!
업데이트 : 현장 아이디어는 작동합니다. 여전히 동일한 http://jsfiddle.net/YoMan78/pnQFQ/13/을 하고 싶은 사람들을위한 간단한 바이올린이 있습니다.
HTML :
<div ng-app="myApp">
<ng-form ng-controller="myCtrl">
Saving: {{isSaving}}
<fieldset ng-disabled="isSaving">
<input type="text" ng-model="btnVal"/>
<input type="button" ng-model="btnVal" value="{{btnVal}}"/>
<button ng-click="save()">Save Me Maybe</button>
</fieldset>
</ng-form>
</div>
그리고 JS :
var angModule = angular.module("myApp", []);
angModule.controller("myCtrl", function ($scope, $filter, $window, $timeout) {
$scope.isSaving = undefined;
$scope.btnVal = 'Yes';
$scope.save = function()
{
$scope.isSaving = true;
$timeout( function()
{
$scope.isSaving = false;
alert( 'done');
}, 10000);
};
});
모든 필드를 fieldset으로 고 다음 과 같이 ngDisabled 지시문을 사용 합니다.
<fieldset ng-disabled="isSaving"> ... inputs ...</fieldset>
모든 입력을 자동으로 설정합니다.
다음 그런 컨트롤러 에서 설정 $scope.isSaving
에 true
HTTP 호출하고 전에 false
이후.
최신 브라우저에는 간단한 솔루션이 있습니다.
CSS 클래스를 정의
.disabled { pointer-events: none; ... ... }
이 수업을 다음에 추가
ng-form
<ng-form data-ng-class="{ 'disabled': isSaving }"> ... inputs ... </ng-form>
다음 은 포인터 이벤트 지원 차트입니다.
참고 :을 설정 한 경우에도 pointer-events: none
키보드로 탭하여 요소를 입력 할 수 있습니다.
반응형
'IT' 카테고리의 다른 글
더 이상 사용하지 않는 모든 오류 PHP 5.3 (0) | 2020.07.14 |
---|---|
요청을 사용하여 Node.js에서 이진 컨텐츠 가져 오기 (0) | 2020.07.14 |
MySQL에서 마지막으로 업데이트 된 행의 ID를 얻는 방법은 무엇입니까? (0) | 2020.07.14 |
순서가 오름차순이고 널이 마지막 필요하는 널 열에 의해 LINQ 순서 (0) | 2020.07.14 |
ReactJS가 수동 클래스 이름에 동적 클래스 추가 (0) | 2020.07.14 |