2

anglejsとangular-ui（特にui-select2機能）を使用して、選択入力の読み取り/書き込みアクセス制御を実現したいと考えています。シナリオは単純です。ng-readonly属性を使用することで、指定された入力値をユーザーが変更できるかどうかを制御できます。

<input id="clientShortName" class="span4" type="text" ng-readonly="readOnly" ng-model="client.shortName" />
<input ui-select2="{ tags: sometags}" id="clientTagsSelection" class="span4" type="text" ng-readonly="readOnly" ng-model="client.tagsSelection"/>
<input type="button" value="Edit" ng-click="readOnly = !readOnly"/>

これは標準のangularjsで正常に機能しますが、angular-uiで定義された入力を使用しようとすると、機能しません（入力の読み取り/書き込み状態は変更されません）。

完全なシナリオはここでカバーされています：http：//plnkr.co/edit/pKs4Tq

4

1 に答える 1

3

残念ながら、AngularUIui-select2ディレクティブはangularJSディレクティブと統合されていませんng-readonly。

これを克服する1つの方法は、独自のディレクティブを作成し、次のreadOnlyようにプロパティの変更を監視することです。

app.directive('csReadonly', function() {
  return {
    restrict: "A",
    link: function(scope, iElement, iAttrs, controller) {
      scope.$watch(iAttrs.csReadonly, function(readonly) {
        iElement.select2(readonly ? 'disable' : 'enable');
      });
    }
  }
});

そして、次のように使用します。

<input ui-select2="{ tags: sometags }" cs-readonly="readOnly" ... />

プランカー： http：//plnkr.co/edit/LBFDg2

このアプローチの利点は、将来AngularUIがのサポートを含めることを決定した場合に、ng-readonlyを置き換えるだけでcs-完了ng-できることです。

于 2012-12-07T16:14:39.227 に答える