Question

我有一个从API动态生成的文本。

如果我重新加载页面，那么在<div><h1>myText</h1></div>中出现5秒后文本，我可以在输入中编辑它。

我正在使用这个插件http://leandropio.github.io/ng-fi-text/ - 看看文字有多大？我只想调整长度大于＆lt; 15到10px。

我用jQuery代码获得了这段代码：

myApp.directive('ng-fix-text', function(){
    return {
        restrict: 'A',
        link: function(scope, element, attrs){
            // Pseudo jQuery code
            var text_len = $('.myDiv').find('h1').text().length;
            if (text_len < 15){
                    $('.myDiv').css('font-size', '10px')
        }
        }
    };
});

顺便说一句，我不想干扰插件内的代码。

Answer 1

您可以使用element函数中声明的link参数，与jQuery完全一样访问声明指令中的每个DOM元素。它实际上就像jQuery一样运行它的jQuery抽象。

首先不要忘记，在角度中，我们通过它的骆驼标准化名称来引用该指令。

Angular规范化元素的标记和属性名称以确定哪些元素匹配哪些指令。我们通常会提到它们区分大小写的camelCase规范化名称。

https://docs.angularjs.org/guide/directive

因此，如果您将指令命名为ng-fix-text，那么您应该将其称为：ng-fix-text。

以下是更新后的代码：

myApp.directive('ngFixText', function() {
    return {
        restrict: 'A',
        link: function(scope, element, attrs) {
            var text_len = element.find('h1').text().length;
            if (text_len < 15) {
                    element.find('h1').css('font-size', '10px')
            }
        }
    };
});

如何调整从API和输入动态生成的文本的大小

1 个答案: