Question

我有一个自定义指令，可以将文件上传到亚马逊并包含callback(onComplete)。当回调完成时，我想将值附加到创建指令的控制器的$scope。在这种情况下，Invite的范围。

Invite和fineUploader都扩展了相同的角度模块。

HTML（简化的）：

<div ng-controller="Invite" class="apply">
    <div fine-uploader ng-switch-when="file"  upload-extensions="jpg,jpeg,png,gif"></div>
</div>

指令：

directive('fineUploader', function() {
    return {
        restrict: 'A',
        require: '?ngModel',
        link: function($scope, element, attributes, ngModel) {
            $scope.uploader = new qq.s3.FineUploader({
                debug: true,
                element: element[0],
                request: {
                    endpoint: 'ballentines-bar-project.s3.amazonaws.com',
                    accessKey: 'AKIAIPT6J4T6XZXV3VWA'
                },callbacks: {
                    onComplete: function(id, fileName, responseJSON) {
                        if (responseJSON.success === true) {
                            console.log(this.getKey(id));
                            console.log($scope);
                            $scope.test = this.getKey(id);
                        }
                    }
                },
                signature: {
                    endpoint: '/s3/'
                },
                iframeSupport: {
                    localBlankPagePath: '/success.html'
                },
                retry: {
                    enableAuto: true // defaults to false
                },
                deleteFile: {
                    enabled: false
                },
                text: {
                    uploadButton: '<p>Upload File</p>'
                },
                template:
                    '<div class="qq-uploader">' +
                        '<div class="qq-upload-button btn btn-info">{uploadButtonText}</div>' +
                        '<ul class="qq-upload-list" ><h2>Your files</h2></ul>' +
                    '</div>',
            });
        }
    };
}).

控制器

controller('Invite', function(
    $scope,
    $localStorage,
    $http
){
    $scope.$storage = $localStorage.$default({
        "formkey": "1MRSAWTRl5-PnVEoy3tD63BL3q_v2mnAhtqa9bdZk-zg",
        "draftResponse": "[]",
        "pageHistory": "0",
    });
    $scope.liking = liking;
    $scope.post = function(){
        $http.post('/signup.php', $scope.$storage).
            success(function(data, status, headers, config){
                console.log(data);
        });
    };
    FB.Event.subscribe('edge.create',
        function(href, widget) {
            liking = true;
        }
    );
})

Answer 1

我会尝试至少两个选项：

<强> [1]

将指令中的scope: {},更改为：

   `scope: { test: '@'},`

这使得test方法在私有范围内可见。

<强> [2]

第二个选项尝试删除隔离范围a.e：scope: {},

Answer 2

您需要将项目从父作用域传递到指令（通过隔离作用域）。或者，像@MaximShoustin一样说并从指令中删除隔离的范围。

所以，选项1：

scope: { directiveProperty: '=nameOfAttributeThatContainsParentProperty' },

或者，选项2：

从指令中删除隔离的范围声明scope: {},。这将允许指令扩展其包含范围的范围。

如何引用应用指令的$ scope？

2 个答案: