ディレクティブ内の式を観察する

Question

基本的に、ディレクティブ内の式の変更をどのように聞くことができますか？

---

私は条件付きで特定のフィールドを必要とするために文書化されていないng-requiredを使用しています：これは素晴らしい作品

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

（here's the Plunkr）。これの唯一の問題は、実際に必要かどうかにかかわらず、placeholderの「必須」テキストを保持していることです。

---

私自身の指令を作成することにしました。ここではそれが動作するはず方法は次のとおりです。

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

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

私は placeholder値を決定するために使用することができます素敵なオブジェクト記録します

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

：

{ required: true } 

のが、どのように私は、その後$digest/$applyサイクルにフックありませんpartnerが変更されるたびにplaceholder属性を更新しますか？

Answer 1

これは必要なものですか？

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

上記{true: 'required', false:''}、その後、インデックスにオブジェクトを作成します：plunker

あなたのリンク機能のための基本的な考え方は、

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); 
    } 

Answer 2

ディレクティブを必要としない代替アプローチ、のようにする必要がありますオブジェクトの現在の値はpartnerです。