控制器和指令之间的范围 $watch 仅在缩小后才起作用

Question

我有一个 controller/view 里面有一个指令。该指令更改控制器范围正在监视的变量。在我缩小所有内容之前，这非常有效。缩小后，没有错误，但监视处理程序不再触发。

我的应用程序由 grunt 使用 yeoman angular 生成器编译。经过大量工作后，它正在正确构建所有内容（通过 grunt serve:dist）。除了 watch 函数处理程序不工作这一事实外，应用程序的其余部分都很好。在开发过程中，一切都完美无缺。

我很确定我所有的依赖项都已声明以避免任何缩小问题。我还使用 ngAnnotate 来清理我遗漏的任何内容。可能是什么问题呢？

这是一个简化的例子：

控制器：

(function(){
    'use strict';

    angular
        .module('app')
        .controller('MyCtrl', MyCtrl);

    MyCtrl.$inject = ['$scope', ...];

    function MyCtrl($scope, ...) {
        $scope.color = null;

        $scope.$watch('color', function(newVal, oldVal) {
            console.log('Color changed');
        });
    };
})();

查看：

<mydirective color="color"></mydirective>

指令：

(function(){
    'use strict';

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

    function mydirective() {
        return {
            restrict: 'E',
            scope: {
                color: '=color'
            },
            templateUrl: 'directive.html',
            link: function($scope, element, attrs, form) {
                $scope.clickHandler = function(val) {
                    $scope.color = val;
                };
            }
        };
    }
})();

指令模板：

<button ng-click="clickHandler('blue')"></button>

Answer 1

经过反复试验，这最终成为我的第三方 Bower 组件的缩小问题（特别是我认为它是 jquery-ui 和 ui-date）。与我最初的想法无关，但有人可能会出现相同的症状。我最终不得不手动返回我的 grunt 文件的每个步骤，直到它起作用（这是我在 vendor.js 中删除额外未使用的依赖项的时候）

控制器和指令之间的范围 $watch 仅在缩小后才起作用

Scope $watch between controller and directive not working only after minification

angularjs

gruntjs