6

基本的に、ディレクティブ内から式の変更をリッスンするにはどうすればよいですか?

ドキュメント化されていないものを使用して、ng-required条件付きで特定のフィールドを要求しています:

<input type="checkbox" ng-model="partner" checked />
<input ng-model="partnerName" placeholder="required" ng-required="partner" />

これはうまく機能します（これが Plunkr です）。これに関する唯一の問題は、placeholder実際に必要かどうかに関係なく、「必要な」テキストが保持されることです。

そこで、独自のディレクティブを作成することにしました。これがどのように機能するかは次のとおりです。

<input ng-placeholder="{ 'required': partner }" />

アイデアは角度の に似てng-classいますが、これを達成する方法がありません。ここに私がこれまでに持っているものがあります:

app.directive('ngPlaceholder', function ($parse) {
    return {
        restrict: 'A',
        link: function (scope, element, attrs) {
            console.log( scope.$eval(attrs.ngPlaceholder) );
        }
    }
});

placeholder値を決定するために使用できる素敵なオブジェクトをログに記録します。

{ required: true }

しかし、どのように$digest/$applyサイクルにフックして、placeholder属性partnerが変更されるたびに更新するのでしょうか?

4

2 に答える 2

2

これは、あなたの望むことですか ？プランカー

リンク機能の基本的な考え方は次のようになります

   link: function (scope, element, attrs) {
        scope.$watch(attrs.xngPlaceholder, function (newVal, oldVal, scope) {
          element.removeAttr('placeholder');
          var att = '';
           angular.forEach(newVal, function (elm, key)
                att += elm ? (key + ' ') : ''; 
            });
            element.attr('placeholder', att);
        }, true);
    }
于 2012-12-26T05:48:07.823 に答える
0

ディレクティブを必要としない別のアプローチ:

placeholder="{{{true: 'required', false:''}[partner]}}"

上記はオブジェクト{true: 'required', false:''}を作成し、の現在の値を使用してオブジェクトにインデックスを付けますpartner。

于 2012-12-26T18:09:17.320 に答える