当前位置: 首页 > 面试题库 >

如何从AngularJS指令设置本机属性?

薛元忠
2023-03-14
问题内容

我想编写类似于以下内容的HTML:

<a href="sharedasset: img.png">test</a>
<img src="sharedasset: img.png"/>

并且有一个名为“ sharedasset”的指令,该指令获取到完整的路径img.png并设置属性的值,而该指令事先不知道属性名称是什么。这可能吗?

更新资料

自从我最初发布此内容以来,对Angular进行了一些改进,因此我想分享一下我现在所做的事情。在HTML中,我使用Guido
Bouman的答案(即创建一个过滤器),现在有了Angular的 一次绑定 功能,这使其成为我认为的最佳选择。

不过,在JS代码中,现在$filter并没有globalVars在所有地方注入和常量,而是将单词添加static到静态内容服务器上托管的资产的任何路径之前{templateUrl: "static/someTemplate.html"},然后使用Angular HTTP
Interceptor查找以以下内容开头的任何路径“静态”并将其替换为静态服务器的域。很简单。


问题答案:
<a full-path="img.png">test</a>
<img full-path="img.png">



app.directive('fullPath', function() {
    return {
        link: function(scope, element, attrs) {
            var fullPathUrl = "http://.../";
            if(element[0].tagName === "A") {
                attrs.$set('href',fullPathUrl + attrs.fullPath);
            } else {
                attrs.$set('src',fullPathUrl + attrs.fullPath);
            }
        },
    }
});

我不知道您从哪里来fullPathUrl,所以我在链接函数中对其进行了硬编码。



 类似资料:
  • 问题内容: 我的AngularJS模板包含一些自定义HTML语法,例如: 我创建了一个指令来处理它: 一切正常,但表达式始终返回,即使在执行时从Google Chrome浏览器的JavaScript控制台可见该属性,该表达式始终返回。 有什么建议吗? 更新:Artem提供了一种解决方案。它包括这样做: AngularJS + stackoverflow =幸福 问题答案: 请参阅指令文档中的属性一

  • 我的AngularJS模板包含一些自定义HTML语法,例如: AngularJS+stackoverflow=bliss

  • 问题内容: 有没有一种方法可以在指令内部设置输入有效性?指令模板中存在的输入。 可以说我有模板: 我的指令就像: 我不能用表单包装它,因为其背后的思想是允许用户将此输入包含在用户的表单中。 问题答案: 您需要检索与输入关联的NgModelController实例。然后调用此对象,指定验证密钥(必需,最小长度,自定义密钥等)。它看起来像这样: 这里最重要的部分是如何获取NgModelControll

  • 问题内容: 这不是一件很难的事,但我无法弄清楚如何做到最好。 我有一个父指令,像这样: 和一个子指令: 如何从子指令轻松访问父指令的和属性?在我的链接函数中,我可以访问父级作用域-我应该用来观察这些属性吗? 放在一起,我想拥有的是: 这个想法是默认情况下显示一组字段。如果单击,它们将成为输入并可进行编辑。 问题答案: 从这篇SO帖子中汲取灵感,我在这个笨拙的人中有一个可行的解决方案。 我不得不改变

  • 装饰器允许我们在指令的host元素上编程设置属性值。 它类似于模板中定义的属性绑定,除了它专门定位到host元素。 对每个变化检测周期检查绑定,因此如果需要,它可以动态地改变。 注意,对于的两个用例,我们传递一个字符串值到我们想要改变的属性。如果我们不向装饰器提供字符串,那么将使用类成员的名称。

  • 本文向大家介绍AngularJS内置指令,包括了AngularJS内置指令的使用技巧和注意事项,需要的朋友参考一下 指令,我将其理解为AngularJS操作HTML element的一种途径。 由于学习AngularJS的第一步就是写内置指令ng-app以指出该节点是应用的根节点,所以指令早已不陌生。 这篇日志简单记录了一些内置指令,先使用起来,再谈一些有趣的东西。 内置指令 所有的内置指令的前缀