监视在继承范围内创建的对象答案

【问题标题】：watching object created on an inherited scope监视在继承范围内创建的对象
【发布时间】：2014-05-02 04:01:19
【问题描述】：

我正在尝试创建一个指令来监视被拖到元素上的文件。我的问题是我似乎无法在 scope.files 上触发监视我也尝试过创建一个隔离范围：

scope:{files:'='}

然后做

scope.$watch('files',function(){})

里面有link函数，但是没有运气。

如何让这款手表接收正在更新的文件？

我添加了“scope.files = []”，因为在设置手表时它最初为空。

angular.module('myApp').directive('dragDrop', [function () {
return {

    link: function (scope, element, attrs) {
        scope.files = [];
        scope.$watch(scope.files, function () {
            if (scope.files !== undefined && scope.files.length === 1) alert("a file has been dropped");
        });
        element.on('dragenter', function (e) {
            e.stopPropagation();
            e.preventDefault();
            $(this).css('border', '2px solid #0B85A1');
        });
        element.on('dragover', function (e) {
            e.stopPropagation();
            e.preventDefault();
        });
        element.on('drop', function (e) {

            $(this).css('border', '0px');
            e.preventDefault();
            //var files = e.originalEvent.dataTransfer.files;
            scope.files = e.originalEvent.dataTransfer.files;

        });
    }
};

【问题讨论】：

标签： angularjs scope directive watch

【解决方案1】：

你应该将$watch()的第三个参数设置为true，

scope.$watch('files',function(){},true)

这是一篇关于$watch() vs. $watchCollection()的好文章

更新

你不能在那里触发监视，因为你使用的是原始对象，这里在指令中使用了复杂对象...

PLUNKER

【讨论】：

嗯，是的，我知道这是我遗漏的东西，但不幸的是，这并没有导致手表被触发。
@MichaelBlom 因为您的 files 变量是原始变量，如果您将其更改为复杂对象子范围，则不会隐藏当前项目，但如果您在子范围中使用原始对象，则创建新实例...检查我的答案更新我添加一个例子...
感谢您抽出宝贵时间帮助@wickY26，你的笨蛋终于把我带到了那里。