Question

我需要创建一个大写elem的所有内容字母的指令

<div>Hello World!</div>

添加全大写

<div all-uppercase>HELLO WORLD!</div>

我的任务是低估Angular如何通过“指令”提供将文本操作到现有html的能力

请发布工作代码......

Answer 1

虽然只需说出css规则text-transform: uppercase就可以通过CSS轻松完成。

指令版本将如下所示。在通过link函数访问元素文本的位置，将其设为大写和＆amp;把它放回元素的文本。

<强>指令

.directive('allUppercase', function(){
  return {
    restrict: 'A',
    link: function(scope, element){
       element.text(element.text().toUpperCase());
    }
  }
});

使用名为uppercase

的角度内置过滤器可以实现同样的功能

{{ 'Hello World!'| uppercase }}

Demo Of All 3

声明AngularJS1指令将大写文本转换为现有元素

1 个答案: