Способ привязать данные из родительской области к элементу в узле в угловом дереве управления?

Question

Работаем над добавлением функции перетаскивания в элемент управления angular-tree: https://github.com/wix/angular-tree-control

Я пытаюсь привязать данные из родительской области к элементу, который я сделал в шаблоне для каждого узла. Однако изолированная область видимости узла затрудняет передачу этой информации. Я добавил атрибут через определение изолированной области (scope: {files: "="}) и установил файлы в моем html. Тем не менее, когда я использовал ng-model="files", данные не меняются или изменение не достигает основной области.

Не может быть, чтобы я не мог видеть изменения. Предполагается, что контрольный триггер из другого углового приложения ( ng-file-upload) сработает и вызовет функцию загрузки файла, когда я изменяю данные основного (а не изолированного) контекста с клиента, а этого не происходит. Если данные правильно связаны из родительской области, функция наблюдения должна быть запущена, потому что свойство родительской области должно изменяться при изменении свойства локальной области. Я могу добавить дальнейшие объяснения или уточнения, если этого недостаточно.

Вот мой HTML-код:

<div treecontrol class="tree-classic"
     tree-model="dataForTheTree"
     files="files"
     options="treeOptions"
     on-selection="showSelected(node)"
     selected-node="node1">
    <span ngf-drop ngf-select ng-model="files" ngf-drag-over-class="dragover" ngf-multiple="true" ngf-allow-dir="true"> 
 {{node.ObjectName}} &nbsp;&nbsp; {{node.FileSize}} {{files}} </span> 
</div>

Вот мой Javascript:

$scope.getserver = function () {
    // Simple POST request example (passing data) :
    $http.post('/api/tree/download', { "Url": "" }).
      success(function (data, status, headers, config) {
          // this callback will be called asynchronously
          // when the response is available
          $scope.dataForTheTree = JSON.parse(JSON.stringify(data));
          $scope.log += JSON.stringify(data);
      }).
      error(function (data, status, headers, config) {
          $scope.log += "error getting file structure";
          // called asynchronously if an error occurs
          // or server returns response with an error status.
      });
}
$scope.$watch('files', function () {
    $scope.upload($scope.files);
});

$scope.upload = function (files) {
    // upload code goes here
}

Вот мои правки в angular-tree-control.js:

scope: {
                treeModel: "=",
                selectedNode: "=?",
                selectedNodes: "=?",
                expandedNodes: "=?",
                onSelection: "&",
                onNodeToggle: "&",
                options: "=?",
                orderBy: "@",
                reverseOrder: "@",
                filterExpression: "=?",
                filterComparator: "=?",
                done: "&",
                //this is my edit
                files: "="
            }

Answer 1

Я сделал это с помощью простого трюка. Вам не нужно создавать новый атрибут для передачи данных в директиву. Поэтому файлы не нужны. Просто измените ng-model="files" в вашем html на ng-model="$parent.files". Проблема в том, что ng-repeat создает изолированную область видимости для каждого узла, а не в angular-tree-control.js (хотя в директиве, скорее всего, используется область видимости для каждого узла, а не родительский).