Javascript 在我的案例中如何在指令中分配数据

我正在寻找John Papa风格的最佳实践。

然而，我对他的指导风格有一个疑问

angular
    .module('app')
    .directive('myExample', myExample);

function myExample() {
    var directive = {
        restrict: 'EA',
        templateUrl: 'app/feature/example.directive.html',
        scope: {
            max: '='
        },
        link: linkFunc,
        controller: ExampleController,
        // note: This would be 'ExampleController' (the exported controller name, as string)
        // if referring to a defined controller in its separate file.
        controllerAs: 'vm',
        bindToController: true // because the scope is isolated
    };

    return directive;

    function linkFunc(scope, el, attr, ctrl) {
        console.log('LINK: scope.min = %s *** should be undefined', scope.min);
        console.log('LINK: scope.max = %s *** should be undefined', scope.max);
        console.log('LINK: scope.vm.min = %s', scope.vm.min);
        console.log('LINK: scope.vm.max = %s', scope.vm.max);
    }
}

ExampleController.$inject = ['$scope'];

function ExampleController($scope) {
    // Injecting $scope just for comparison
    var vm = this;

    vm.min = 3;

    console.log('CTRL: $scope.vm.min = %s', $scope.vm.min);
    console.log('CTRL: $scope.vm.max = %s', $scope.vm.max);
    console.log('CTRL: vm.min = %s', vm.min);
    console.log('CTRL: vm.max = %s', vm.max);
}


<!-- example.directive.html -->
<div>hello world</div>
<div>max={{vm.max}}<input ng-model="vm.max"/></div>
<div>min={{vm.min}}<input ng-model="vm.min"/></div>

angular
.module（'应用程序'）
.指令（“myExample”，myExample）；
函数myExample（）{
var指令={
限制：“EA”，
templateUrl:'app/feature/example.directive.html'，
范围：{
最大值：'='
},
链接：linkFunc，
控制器：例如控制器，
//注意：这将是“ExampleController”（导出的控制器名称，作为字符串）
//如果在其单独的文件中引用已定义的控制器。
controllerAs:'vm'，
bindToController:true//因为作用域是隔离的
};
返回指令；
函数linkFunc（范围、el、属性、ctrl）{
console.log（'LINK:scope.min=%s***应该是未定义的，'scope.min'）；
console.log（'LINK:scope.max=%s***应该是未定义的，'scope.max'）；
log（'LINK:scope.vm.min=%s'，scope.vm.min'）；
log（'LINK:scope.vm.max=%s'，scope.vm.max'）；
}
}
示例控制器。$inject=['$scope']；
函数示例控制器（$scope）{
//注入$scope只是为了比较
var vm=这个；
vm.min=3；
log（'CTRL:$scope.vm.min=%s'，$scope.vm.min）；
log（'CTRL:$scope.vm.max=%s'，$scope.vm.max）；
console.log（'CTRL:vm.min=%s'，vm.min'）；
console.log（'CTRL:vm.max=%s'，vm.max'）；
}
你好，世界
max={{vm.max}
min={{vm.min}

---

在他的示例中，他在一个文件中同时包含控制器和指令。我的问题是如何知道我的代码的哪一部分在

linkFunc

下，哪一部分在

ExampleController

下？例如，如果我想注入服务，我应该将其添加到

linkFunc

？如果我收到一组数据，我应该在

linkFucn

下使用

scope.data

还是在controller下使用

vm.data

？非常感谢

这里有几个需要考虑的原则：

• 基本区别在于控制器可以公开API，链接函数可以使用require与控制器交互最佳实践：当您想向其他指令公开API时，请使用控制器。否则请使用链接

• 在控制器中编写业务逻辑，在链接中编写DOM操作

更直截了当的回答：

由于

$scope

（在控制器中）==

vm

（在控制器中）==

scope

（在链接中），您可以在linkFucn或vm.data下执行scope.data

您并没有将服务注入到链接函数中，而是注入到控制器中

只是我的理解