跟踪窗口上的元素宽度调整角度JS

我正在尝试构建一个指令来跟踪容器的宽度,并在窗口调整大小时更改它。我发现了很多可以动态跟踪窗口大小调整的指令,但是否可以重写该指令,使其仍然触发每次调整大小,而不是计算每次触发时的窗口宽度,而是计算特定元素的宽度? 到目前为止,我使用了:

app.directive('monitorWindow', ['$window', function ($window) {
    return {
        link: link,
        restrict: 'A'
    };
    function link(scope, element, attrs){
        scope.windowWidth = $window.innerWidth ;

        function onResize(){
            console.log("window width is: " + $window.innerWidth);
            // uncomment for only fire when $window.innerWidth change
            if (scope.windowWidth !== $window.innerWidth)
            {
                scope.windowWidth = $window.innerWidth;
                scope.$digest();
            }
        }

        function cleanUp() {
            angular.element($window).off('resize', onResize);
        }

        angular.element($window).on('resize', onResize);
        scope.$on('$destroy', cleanUp);
    }
}]);

它跟踪窗口大小,而不是特定的div。我发现了一个指令,它获取元素维度,但在调整大小时不会更新。 两人并排进行测试: https://codepen.io/mbezema/pen/odBpPo

我在div中构建一个svg图形时使用它,该div基于范围计算点和线。宽度如果这改变了,整个图表需要改变。