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的价值并将其分配给所有<{p}}

Answer 1

通过向指令添加范围，我们创建了一个“隔离范围”。使用此方法，范围可以通过3种方式捕获属性：

@ 从DOM中捕获属性值作为字符串值。
= 将该属性评估为父作用域的属性。
& 将该属性评估为父作用域的方法。

您可以在此处详细了解：

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

根据您的上述示例，您似乎需要使用&更改=

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

Answer 2

scope: {
    datasource: '&',
}

通过执行此操作，您将声明您希望数据源有效地绑定到函数指针。如果这是你需要的，那就没问题了。但是，如果要绑定到变量/表达式，请使用'='，或者如果要绑定到字符串，请使用'@'。

其他一些观点。

您似乎只是使用datasource来设置新的范围变量（因为您现在使用的是隔离的范围，所以是新的）：

scope.activeSlide = scope.datasource;

从外观上看这是多余的。您只需在需要的地方引用scope.datasource，而不是在此阶段基本创建重复内容。

其次，您通过使用imagesFormat提供程序访问attrs，这很好......但请注意，您也可以在范围内定义此内容：

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

然后使用：

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

和

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

通过范围angularjs将变量传递给指令

2 个答案: