programing

로드 시 Angularjs 체크박스가 기본적으로 켜져 있으며 이 체크박스를 켜면 목록 선택을 비활성화합니다.

goodsources 2023. 4. 6. 21:37
반응형

로드 시 Angularjs 체크박스가 기본적으로 켜져 있으며 이 체크박스를 켜면 목록 선택을 비활성화합니다.

스택 오버플로우 위의 noob.저는 전송 작업 기능이 있는 웹 페이지를 만들고 있습니다.사용자는 이 체크박스를 켜고 작업을 사무실로 보내거나 사용 가능한 모든 기술자를 목록에서 선택할 수 있습니다.질문은 페이지가 로드될 때 기본적으로 선택되어 선택 목록이 비활성화되도록 확인란을 설정하는 방법입니다.현재 가지고 있는 코드는 다음과 같습니다.

<div ng-app="">
  Send to Office: <input type="checkbox" ng-model="checked" ng-checked="true"><br/>
  <select id="transferTo" ng-disabled="checked">
    <option>Tech1</option>
    <option>Tech2</option>
  </select>
</div>

여기 jsfiddle이 있습니다.http://jsfiddle.net/hugmungus/LvHJw/5/

현재 체크박스가 켜져 있는 상태로 페이지가 로드되지만 목록이 비활성화되지는 않습니다.이 체크박스를 끄고 다시 체크하면 목록이 비활성화됩니다.

도와줘서 고마워요!

ng-model을 사용하는 경우 ng-check도 사용하지 않습니다.대신 모델 변수를 true로 초기화합니다.통상, 이 조작은, 페이지를 관리하는 컨트롤러로 실시합니다)당신의 바이올린으로 저는 데모 목적으로 ng-init 속성으로 초기화를 했습니다.

http://jsfiddle.net/UTULc/

<div ng-app="">
  Send to Office: <input type="checkbox" ng-model="checked" ng-init="checked=true"><br/>
  <select id="transferTo" ng-disabled="checked">
    <option>Tech1</option>
    <option>Tech2</option>
  </select>
</div>

컨트롤러에서 실행(아래 구문과 같이 컨트롤러)

컨트롤러:

vm.question= {};
vm.question.active = true;

형태

<input ng-model="vm.question.active" type="checkbox" id="active" name="active">

명령어는 실제로 필요하지 않습니다.ng-init 및 ng-checked를 사용하여 실행할 수 있습니다.아래 데모 링크는 angularjs 체크박스의 초기값을 설정하는 방법을 보여줍니다.

데모 링크:

<form>
    <div>
      Released<input type="checkbox" ng-model="Released" ng-bind-html="ACR.Released" ng-true-value="true" ng-false-value="false" ng-init='Released=true' ng-checked='true' /> 
      Inactivated<input type="checkbox" ng-model="Inactivated" ng-bind-html="Inactivated" ng-true-value="true" ng-false-value="false" ng-init='Inactivated=false' ng-checked='false' /> 
      Title Changed<input type="checkbox" ng-model="Title" ng-bind-html="Title" ng-true-value="true" ng-false-value="false" ng-init='Title=false' ng-checked='false' />
    </div>
    <br/>
    <div>Released value is  <b>{{Released}}</b></div>
    <br/>
    <div>Inactivated  value is  <b>{{Inactivated}}</b></div>
    <br/>
    <div>Title  value is  <b>{{Title}}</b></div>
    <br/>
  </form>

// Code goes here

  var app = angular.module("myApp", []);
        app.controller("myCtrl", function ($scope) {

         });    

컨트롤러에서 실행

$timeout(function(){
$scope.checked = true;
}, 1);

ng 체크박스를 제거합니다.

언급URL : https://stackoverflow.com/questions/17374146/angularjs-checkbox-checked-by-default-on-load-and-disables-select-list-when-chec

반응형