Javascript AngularJS指令回调函数

所以我有一个指令，它接受一个回调函数作为一个带有其他选项的参数。 以下是指令：

.directive('csvReader', [function () {

    // Function to convert to JSON
    var convertToJSON = function (content) {

        // Declare our variables
        var lines = content.csv.split('\n'),
            headers = lines[0].split(content.separator),
            columnCount = lines[0].split(content.separator).length,
            results = [];

        // For each row
        for (var i = 1; i < lines.length; i++) {

            // Declare an object
            var obj = {};

            // Get our current line
            var line = lines[i].split(new RegExp(content.separator + '(?![^"]*"(?:(?:[^"]*"){2})*[^"]*$)'));

            // For each header
            for (var j = 0; j < headers.length; j++) {

                // Populate our object
                obj[headers[j]] = line[j];
            }

            // Push our object to our result array
            results.push(obj);
        }

        // Return our array
        return results;
    };

    return {
        restrict: 'A',
        scope: {
            results: '=',
            separator: '=',
            complete: '&'
        },
        link: function (scope, element, attrs) {

            // Create our data model
            var data = {
                csv: null,
                separator: scope.separator || ','
            };

            // When the file input changes
            element.on('change', function (e) {

                // Get our files
                var files = e.target.files;

                // If we have some files
                if (files && files.length) {

                    // Create our fileReader and get our file
                    var reader = new FileReader();
                    var file = (e.srcElement || e.target).files[0];

                    // Once the fileReader has loaded
                    reader.onload = function (e) {

                        // Get the contents of the reader
                        var contents = e.target.result;

                        // Set our contents to our data model
                        data.csv = contents;

                        // Apply to the scope
                        scope.$apply(function () {

                            // Our data after it has been converted to JSON
                            scope.results = convertToJSON(data);

                            // If we have a callback function
                            if (scope.complete) {

                                // Execute our callback
                                scope.complete(scope.results);
                            }
                        });
                    };

                    // Read our file contents
                    reader.readAsText(file);
                }
            });
        }
    };
}])

HTML中的指令如下所示：

<div class="portlet light" ng-if="controller.results.length && !controller.import.error">
    <div class="portlet-title">

        <div class="caption caption-md">
            <span class="caption-subject font-green-haze bold uppercase">Collections to import</span>
        </div>

        <div class="inputs">
            <div class="portlet-input input-inline input-small">
                <div class="input-icon right">
                    <i class="icon-magnifier"></i>
                    <input type="text" class="form-control form-control-solid" placeholder="search..." ng-model="controller.filter">
                </div>
            </div>
        </div>

        <div class="actions">
            <div class="btn-group btn-group-devided" data-toggle="buttons">
                <label class="btn btn-transparent grey-salsa btn-circle btn-sm" ng-repeat="size in controller.pageSizes" ng-class="{ active: controller.pageSize === size }">
                    <input type="radio" name="options" class="toggle" ng-model="controller.pageSize" ng-change="controller.pageSize = size"> {{ size }}
                </label>
            </div>
        </div>

    </div>
    <div class="portlet-body">

        <table class="table table-hover table-light">
            <thead>
                <tr class="uppercase">
                    <th>
                        <a href="" ng-click="controller.predicate = 'reference'; controller.reverse = !controller.reverse">Reference</a>
                    </th>
                    <th>
                        <a href="" ng-click="controller.predicate = 'customerReference'; controller.reverse = !controller.reverse">Customer Reference</a>
                    </th>
                    <th>
                        <a href="" ng-click="controller.predicate = 'customerName'; controller.reverse = !controller.reverse">Name</a>
                    </th>
                    <th>
                        <a href="" ng-click="controller.predicate = 'customerBusinessName'; controller.reverse = !controller.reverse">Company</a>
                    </th>
                    <th>
                        <a href="" ng-click="controller.predicate = 'supplierName'; controller.reverse = !controller.reverse">Supplier</a>
                    </th>
                    <th>
                        <a href="" ng-click="controller.predicate = 'collectionCode'; controller.reverse = !controller.reverse">Code</a>
                    </th>
                    <th>
                        <a href="" ng-click="controller.predicate = 'status'; controller.reverse = !controller.reverse">Status</a>
                    </th>
                    <th>
                        <a href="" ng-click="controller.predicate = 'plannedCollectionDate'; controller.reverse = !controller.reverse">Date</a>
                    </th>
                </tr>
            </thead>
            <tbody>
                <tr dir-paginate="collection in controller.results | orderBy: controller.predicate:controller.reverse | filter: controller.filter | itemsPerPage : controller.pageSize">
                    <td>
                        {{ collection.reference }}
                    </td>
                    <td>
                        {{ collection.customerReference }}
                    </td>
                    <td>
                        {{ collection.customerName }}
                    </td>
                    <td>
                        {{ collection.customerBusinessName }}
                    </td>
                    <td>
                        {{ collection.supplierName }}
                    </td>
                    <td>
                        {{ collection.collectionCode }}
                    </td>
                    <td>
                        {{ collection.status }}
                    </td>
                    <td>
                        {{ collection.plannedCollectionDate }}
                    </td>
                </tr>
            </tbody>
        </table>

        <dir-pagination-controls></dir-pagination-controls>

        <div class="form-group">
            <button class="btn btn-primary" ng-click="controller.save()">Import</button>
            <button class="btn btn-default" ng-click="controller.cancel()">Cancel</button>
        </div>
    </div>
</div>

 <input type="file" csv-reader results="controller.results" complete="controller.validateResults(results)" />

---

有人能解释一下我做错了什么吗？

当您使用结果调用回调时，您需要使用键

results将其传递到object中：

if (scope.complete) {
    // Execute our callback
    scope.complete({results: scope.results});
}

传递给
scope.complete
的对象中的键
results
对应于HTML
complete=“controller.validateResults（results）”
中定义的参数名称

if (scope.complete) {
    // Execute our callback
    scope.complete({results: scope.results});
}