Question

我目前正在学习使用AngularJs中的指令，尽管我知道Angular 2.0仍处于alpha状态，但我已开始在网上阅读“准备角度2.0”的文章。

有很多人提到退出链接功能并使用控制器和bindToController只是为了使指令更像是一个Angular 2.0“组件”。

我遇到的问题是我真的不知道如何将我的指令范围传递给我用于该指令的控制器...
例如，当给出以下指令时：

(function() {
  'use strict';

  angular.module('app').directive('gidsImagePreview', imagePreview);

  /* @ngInject */
  function imagePreview() {
    var directive = {
        restrict: 'EA',
      templateUrl: 'scripts/directives/gidsImagePreview.directive.html',
      scope : {
            images : '='
        },
      controller: ImagePreviewController,
      controllerAs: 'vm',
            bindToController: true
    };

    return directive;
  }

    /* @ngInject */
  function ImagePreviewController(){
        var self = this;
        self.featured = self.images[0];
        self.preview = preview;

        function preview(img){
            self.featured = img;
        }
  }
})();

以下html“调用”该指令（vm.project.images是一个带有filename属性的图像对象数组）：

<gids-image-preview images="vm.project.images"></gids-image-preview>

那么，ImagePreviewController中的“self.images”总是未定义的怎么样？

阅读this article，他/她似乎正在做我正在做的事情（只是没有使用数组对象）......

Answer 1

您只需将范围注入控制器即可。如果你没有缩小你的作用，你只需将$scope作为参数ImagePreviewController：

    function ImagePreviewController($scope) {
        ...
     }

此外，如果缩小很重要，请在控制器定义下添加ImagePreviewController.$inject = ['$scope'];。

如果要使用数组文字语法，请按以下方式声明：

    var ImagePreviewController = ['$scope', function ($scope) { ... }];

然后您可以通过$scope.images访问图像数组。我更喜欢使用$inject属性，只是作为一种风格问题。您尝试使用的此/自行工作流仅在您希望控制器本身公开API以供其他指令使用时才有用。

为了将来参考，角度文档对指令有完整的描述，并且可以用不同的方式构成它们：https://docs.angularjs.org/guide/directive

Answer 2

但你可以使用[directiveElement] .getIsolatedScope（）函数。它随处可用。也许这个函数可以帮助你以其他方式解决你的问题。

Answer 3

事实证明，我所做的事情并没有什么不对。这是一个时间问题当我想在我的指令控制器中使用“images”时，它仍然是未定义的，因为我的指令绑定的主要对象（project.images）尚未加载。
我在路由配置中添加了一个resolve函数，以确保在打开详细信息页面（包含指令）之前加载了主对象。

另外，只是为了补充一点，@ camden_kid提到我必须在我的控制器中使用var vm = this因为我使用了controllerAs：“vm”选项;据我所知，这不是真的，你在控制器功能中使用的内容与你在视图中引用该控制器属性的方式无关。
所以，使用controllerAs：'vm'只意味着你必须使用“vm”。视图中的符号。它与你将在控制器函数中使用的变量无关（如果这是错误的话，请纠正我，但是，从我到目前为止学到的情况来看，情况并非如此）。

将angular指令范围传递给指令控制器

3 个答案: