AngularJS ng-options를 사용할 때 선택 요소의 <option>을 비활성화하는 방법은 무엇입니까?

StackOverflow https://stackoverflow.com//questions/21002616

문제

비활성화하는 방법이 있나요? option 안에 select 채울 때의 요소 options AngularJS에 ng-options가 있나요?

이와 같이: http://www.w3schools.com/tags/att_option_disabled.asp

추가하시면 됩니다 ng-disabled 각자에게 <option> 태그를 사용하는 경우 이를 수행할 수 있는 방법이 있습니까? ng-options 지시어 select 꼬리표?

도움이 되었습니까?

해결책

이를 수행하는 한 가지 방법은 사용을 잊어버리는 것입니다. ng-options 에 select 요소에 옵션을 추가하고 ng-repeat, 그런 다음 ng-disabled 각각을 확인하세요 option.

http://jsfiddle.net/97LP2/

<div ng-app="myapp">
    <form ng-controller="ctrl">
        <select id="t1" ng-model="curval">
            <option ng-repeat="i in options" value="{{i}}" ng-disabled="disabled[i]">{{i}}</option>
        </select>
        <button ng-click="disabled[curval]=true">disable</button>
    </form>
</div>

테스트를 위한 최소 컨트롤러:

angular.module('myapp',[]).controller("ctrl", function($scope){
    $scope.options=['test1','test2','test3','test4','test5'];
    $scope.disabled={};
})

다른 팁

에서 각도 1.4 :우리는 사용할 수 있습니다 disable when ng-options에서 예를 들면 다음과 같습니다.

 $scope.colors = [
  {name:'black', shade:'dark'},
  {name:'white', shade:'light', notAnOption: true},
  {name:'red', shade:'dark'},
  {name:'blue', shade:'dark', notAnOption: true},
  {name:'yellow', shade:'light', notAnOption: false}
];
$scope.myColor = $scope.colors[2]; // red

이 예에는 색상이 음영별로 그룹화되어 있으며 일부는 비활성화되어 있습니다.

<select ng-model="myColor" ng-options="color.name group by color.shade disable when color.notAnOption for color in colors"></select>

이 코드는 다음에서 얻었습니다. 각도 문서.

당신은 사용해야합니다 ng-disabled 지령 http://docs.angularjs.org/api/ng.directive:ngDisabled.

<body ng-app="myApp">

  <div ng-controller="myCtrl">
    <form class="form-inline">
      <div class="form-group">
        <select class="form-control" ng-disabled="disableSelect">
          <option val="one">First</option>
          <option val="two">Second</option>
        </select>
      </div>

      <button class="btn btn-default" ng-click="disableSelect = !disableSelect">
        Disable select
      </button>
    </form>
  </div>

</body>

여기에서 전체 예제를 찾을 수 있습니다. http://jsbin.com/ihOYurO/1/

버전 1.4로 해결 https://docs.angularjs.org/api/ng/directive/ngOptions [v1.4 문서를 찾는지 다시 확인하세요]

아마도 이런 것 같아요

<button ng-click='disableSelect=true'></button>

<select ng-disabled='disableSelect'></select>
라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top