Как использовать несколько раз одну и ту же директиву?

Question

[Пётр]

Написал свою директиву, которая должна на странице использоваться несколько раз, но с разными данными.
В итоге получается, что она берёт данные из последнего подключения и вставляет во все подключенные директивы.

В разметке подключаю

<tab heading="Пополнить">
      <transaction type="deposit"></transaction>
    </tab>
    <tab heading="Вывести">
      <transaction type="cashout"></transaction>
    </tab>

Директива:

function transaction(){
  return {
    restrict: 'EA',
    replace: true,
    transclude: true,
    templateUrl: 'directives/transaction/transaction.html',
    link: function (scope, element, attrs) {
    },
    controller: function($scope, $attrs){
      var type = $attrs.type;

      $scope.textButton = 'Пополнить счет';

      switch (type){
        case 'deposit':
          $scope.textButton = 'Пополнить счет';
              break;
        case 'cashout':
          $scope.textButton = 'Снять';
              break;
        default:
              console.log('мимо');
              break;
      }
    }
  }
}

Получается так, что в моем случае всегда выводится надпись в кнопке : "Снять".

Как это исправить, что бы в первом случае у кнопки была надпись "Пополнить счет", в во втором "Снять"?

Answer 1

[Евгений Куманин]

Потому что $scope в директиве будет один и тот-же.

UPD: plnkr.co

Comments

[Пётр]

Спасибо, то, что нужно!