angularjs ng-optionsを使用しているときに、select要素の<オプション>を無効にする方法

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

質問

optionエレメントにselectをangularjsのNGオプションに入力すると、optionsエレメントでは、ng-disabledを無効にする方法はありますか？

これと同じように：

役に立ちましたか？

解決

ng-options要素でselectを使用し、ng-repeatを使用してオプションを追加する1つの方法は、各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 から

NGオプションでdisable whenを使用できます。

 $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
.

この例にはShadeによってグループ化された色があり、無効になっています：

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

私は angular documentation 。

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/ディレクティブ/ NGOPTIONS [V1.4ドキュメントを探す]

おそらくこのようなもの

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

<select ng-disabled='disableSelect'></select>
.

ライセンス： CC-BY-SA と 帰属
所属していません StackOverflow
scroll top