Material Designのmd-grid-tile要素をディレクティブにカプセル化する方法は？

Question

私が代わるディレクティブ作成することによって、私のタイルをリファクタリングしようとしている：以下の定義に

<md-grid-list md-cols="2" md-row-height="1:1" md-gutter="12px"> 
    <card ng-repeat="card in cards" card="card"></card> 
</md-grid-list> 

：カスタムディレクティブで

<md-grid-list md-cols="2" md-row-height="1:1" md-gutter="12px"> 
    <md-grid-tile ng-repeat="card in cards" class="card-tile" md-rowspan="1" md-colspan="1"> 
     <md-grid-tile-footer> 
      <h3>{{CCtrl.card.title}}</h3> 
      <h4 class="md-caption">Last updated {{CCtrl.card.lastUpdated | ago}}</h4> 
     </md-grid-tile-footer> 
    </md-grid-tile> 
</md-grid-list> 

を

.directive('card', function(CONFIG) { 
     return { 
      restrict: 'AE', 
      scope: { 
       card: '=' 
      }, 
      replace: true, 
      templateUrl: './ng/Card/card.tpl.html', 
      controller: 'CardCtrl', 
      controllerAs: 'CCtrl', 
      bindToController: true 
     } 
    }) 

とテンプレート（card.tpl.html）：

<md-grid-tile class="card-tile" md-rowspan="1" md-colspan="1"> 
     <md-grid-tile-footer> 
      <h3>{{CCtrl.card.title}}</h3> 
      <h4 class="md-caption">Last updated {{CCtrl.card.lastUpdated | ago}}</h4> 
     </md-grid-tile-footer> 
    </md-grid-tile> 

マテリアルデザインのスタイル/レイアウトを機能させるには、 "replace：true"を使用する必要があります。 私は以下のエラーを取得しています：

Error: $compile:multidir 
Multiple Directive Resource Contention 
Multiple directives [card (module: project), mdGridTile (module: 
material.components.gridList)] asking for new/isolated scope on: <md- 
grid-tile class="card-tile" md-rowspan="1" md-colspan="1" ng- 
repeat="card in cards.sketchCards" card="card"> 

は、カスタムディレクティブでMD-グリッドタイルをカプセル化する方法はありますか？あなたはcardディレクティブからscopeプロパティを削除した場合

Answer 1

は、我々はカード属性を$evalできcardディレクティブlink機能に

そして、そのディレクティブの孤立範囲を奪うとスコープでそれを保存することができますかコントローラ。

function link (scope, element, attrs, ctrl) { 
    // we do this to bypass isolated scope 
    // stored on scope 
    scope.card = scope.$eval(attrs.card); 
    // stored on controller 
    ctrl.card = scope.$eval(attrs.card); 
} 

このアプローチの欠点は、カードデータがcardコントローラ内に存在するためにあなたが$watchする必要があります。