Передача переменной в директиву с помощью области angularjs

Question

У меня есть переменная, которую я хочу передать в свою директиву через область действия, а затем использовать эту переменную в ссылке, если это возможно. Я довольно новый, используя директивы, несколько вещей для меня немного размыты. Это мой текущий код

.directive('imagesFormat', function($cordovaCamera, $ionicModal, $cordovaFile, $cordovaFileTransfer) { 
     return { 
     restrict: 'EA', 
     scope: { 
      datasource: '&', 
     }, 
     link: function(scope, element, attrs) { 
      element.bind("click", function() { 
      if(attrs.imagesFormat === "takePhoto") { 
       var options = { 
       destinationType : Camera.DestinationType.FILE_URI, 
       sourceType : Camera.PictureSourceType.CAMERA, 
       allowEdit : false, 
       encodingType: Camera.EncodingType.JPEG, 
       popoverOptions: CameraPopoverOptions, 
       correctOrientation: true 
       }; 
      } 
      if(attrs.imagesFormat === "choosePhoto") { 
       var options = { 
       destinationType : Camera.DestinationType.FILE_URI, 
       sourceType : Camera.PictureSourceType.PHOTOLIBRARY, 
       allowEdit : false, 
       encodingType: Camera.EncodingType.JPEG, 
       popoverOptions: CameraPopoverOptions, 
       mediaType: Camera.MediaType.PICTURE, 
       correctOrientation: true 
       }; 
      } 
      scope.activeSlide = scope.datasource; 
     }); 
     } 
    } 
    }) 

мой HTML код

<ion-content overflow-scroll='false'> 
     <div class= "row"> 
     <div class="col"> 
     <button images-format="takePhoto" datasource="$index">Take Photo</button> 
     </div> 
     <div class="col"> 
     <button images-format="choosePhoto" datasource="$index">Image Gallery/File</button> 
     </div> 
     </div> 
    </ion-content> 

Поэтому в основном то, что я хочу, чтобы иметь возможность получить в моей директиве это значение $index и назначить его на scope.activeSlide = scope.datasource вот и все

Answer 1

Добавив область действия к директиве мы создаем «изолированный объем». При таком подходе сфера может захватить атрибуты в 3 способами:

1. @ Захватывает значение атрибута из DOM в качестве значения строки.
2. = Оценивает атрибут как свойство родительской области.
3. & Оценивает атрибут как метод родительской области.

Вы можете прочитать об этом здесь:

http://onehungrymind.com/angularjs-sticky-notes-pt-2-isolated-scope/

Основываясь на вашем примере выше, кажется, что вы должны изменить свой & с =

restrict: 'EA', 
     scope: { 
      datasource: '=', 
     }, 

Answer 2

scope: { 
    datasource: '&', 
} 

Делая это, вы заявляете, что ожидаете, что источник данных будет связан, указатель функции. Если это то, что вам нужно, тогда это нормально. Однако, если вы хотите привязать к переменной/выражению, используйте '=', или если вы хотите привязать к строке, используйте '@'.

Некоторые другие моменты.

Вы, кажется, только затем использовать datasource, чтобы установить новую переменную Scope (новый, так как вы в настоящее время работают с изолированной сферы):

scope.activeSlide = scope.datasource;

Это из внешнего вида этого является излишним. Вы можете просто ссылаться на scope.datasource, где бы вы ни нуждались, вместо этого, а затем в основном создавая дубликат на этом этапе.

Во-вторых, вы получаете доступ к imagesFormat с помощью провайдера attrs, и это нормально ...но учтите, что вы могли бы также это определено в объеме:

scope: { 
    datasource: '&', 
    imagesFormat: '@' 
} 

, а затем использовать:

<button images-format="takePhoto" datasource="$index">Take Photo</button> 

и

if(scope.imagesFormat === "takePhoto")