AngularJS 手表无法检测到输入范围 ng-model 的变化

Question

收到我的指示

<input type="range" min="10" max="100" ng-model="svgConfig.textConfig.fontSize" />

在我的控制器中我得到了像

这样的对象

$scope.svgConfig = {
    text:'',
    textConfig: {
        fontSize: 20
    },
    rectConfig: []
};

试图在 link for 指令中捕获此处的更改，但没有任何反应。

var setDomBindings = function($scope, $element, $attrs){

    $scope.$watch('svgConfig.textConfig.fontSize', function() {
        var domText = $element.find('text'),
            textExample = domText.last()[0],
            dataText = $scope.svgConfig.text;

        debugger; //haven't even been reached! 

        if($.isEmptyObject(textExample) && domText.length === 0 && dataText === 0){
            $scope.clearSvgRectConfig();
            return;
        }

        $scope.setSvgRectConfig(textExample, domText.length);
    });
};

/*
* Retruns initialized DOM element
*/
return {
    restrict: 'E',
    templateUrl: './app/shared/imageTextEditor/imageTxtSvgView.html',
    controller: 'imageTxtSvgController',
    transclude: true,
    link: setDomBindings
};

Answer 1

请记住，此函数不会按标签名称/CSS 选择器查找元素。对于按标签名称查找，请尝试 angular.element(document).find(...) 或 $document.find()，或使用标准 DOM API，例如document.querySelectorAll() 您确实可以访问 children()、contents() 和 data() 实现，因此通常可以找到解决方法。

AngularJS 手表无法检测到输入范围 ng-model 的变化

AngularJS watch can't detect input range ng-model changes

javascript

font-size

angularjs