13赞

使用Angular2动态填充css Pseudo-element'之前'的内容

作者：360691894_8a5c48 | 2023-09-07 12:34

如何解决《使用Angular2动态填充cssPseudo-element'之前'的内容》经验，为你挑选了1个好方法。

我很难尝试动态填充:before伪元素的'content'值.我已经发现在早期版本的AngularJS上有可能在这里的另一个问题,通过在其上有before-pseudo元素的元素上创建额外的数据属性,然后attr()在CSS中读取该值.

当使用普通字符串作为值时似乎工作得很好:

// CSS
.test:before {
  content: attr(data-before);
}

// Template

  Hello {{name}}

但是当我尝试使用这样的插值填充数据时,我收到一个错误:

// CSS
.test:before {
  content: attr(data-before);
}

// Template

  Hello {{name}}

我在这里错过了什么？生成的错误是:

Error: Template parse errors:
Can't bind to 'before' since it isn't a known property of 'div'.

这是plunker中的非工作版本:http://plnkr.co/edit/HwVp9jlsx6uKfoRduxWu

1> Frank Fajard..：

使用:

UPDATE

你也可以name像这样放下方括号:

这似乎是我看到的一些例子中的惯例.我认为这是有效的,因为你已经告诉Angular通过指定来执行绑定[attr.data-before],并且假设右边的数据来自相应的组件.

推荐阅读

程序员
在基于标签栏的应用程序上添加导航栏

如何解决《在基于标签栏的应用程序上添加导航栏》经验，为你挑选了1个好方法。 ... [详细]
程序员
比较两个对象中存在的属性

如何解决《比较两个对象中存在的属性》经验，为你挑选了1个好方法。 ... [详细]
程序员
C++不能直接在小例子中调用构造函数

如何解决《C++不能直接在小例子中调用构造函数》经验，为你挑选了2个好方法。 ... [详细]
程序员
在Administrate Gem Rails中设置Admin

如何解决《在AdministrateGemRails中设置Admin》经验，为你挑选了1个好方法。 ... [详细]
程序员
如何从vscode扩展写入日志？

如何解决《如何从vscode扩展写入日志？》经验，为你挑选了1个好方法。 ... [详细]
程序员
为什么Roslyn在尝试重写这个lambda时会崩溃？(Visual Studio 2015更新1)

如何解决《为什么Roslyn在尝试重写这个lambda时会崩溃？(VisualStudio2015更新1)》经验，为你挑选了1个好方法。 ... [详细]
程序员
Sparql变量在块内部未绑定的块之外

如何解决《Sparql变量在块内部未绑定的块之外》经验，为你挑选了1个好方法。 ... [详细]
程序员
JSON模式枚举与单值的模式

如何解决《JSON模式枚举与单值的模式》经验，为你挑选了2个好方法。 ... [详细]
程序员
隐式意图的自定义权限

如何解决《隐式意图的自定义权限》经验，为你挑选了0个好方法。 ... [详细]
程序员
散景,两个y轴,禁用一个轴进行缩放/平移

如何解决《散景,两个y轴,禁用一个轴进行缩放/平移》经验，为你挑选了0个好方法。 ... [详细]
程序员
在服务器端登录用户帐户

如何解决《在服务器端登录用户帐户》经验，为你挑选了1个好方法。 ... [详细]
程序员
Kendo TabStrip中的Kendo MVC网格

如何解决《KendoTabStrip中的KendoMVC网格》经验，为你挑选了1个好方法。 ... [详细]
程序员
如何在symfony WebTestCase中通过测试中的fixture类型获取doctrine fixture引用？

如何解决《如何在symfonyWebTestCase中通过测试中的fixture类型获取doctrinefixture引用？》经验，为你挑选了0个好方法。 ... [详细]
程序员
如果消息是由制作人制作的,如何从Kafka经纪人那里得到确认？

如何解决《如果消息是由制作人制作的,如何从Kafka经纪人那里得到确认？》经验，为你挑选了0个好方法。 ... [详细]
程序员
为什么java没有从用户定义的类执行overriden hashcode()方法？

如何解决《为什么java没有从用户定义的类执行overridenhashcode()方法？》经验，为你挑选了1个好方法。 ... [详细]
程序员
有没有其他更好的方法将参数传递给backgroundworker runasync？

如何解决《有没有其他更好的方法将参数传递给backgroundworkerrunasync？》经验，为你挑选了1个好方法。 ... [详细]
程序员
Cassandra的监听地址总是在监听ipv6地址

如何解决《Cassandra的监听地址总是在监听ipv6地址》经验，为你挑选了0个好方法。 ... [详细]
程序员
iPython笔记本错误 - Notebook JSON无效:u'execution_count'是必需属性

如何解决《iPython笔记本错误-NotebookJSON无效:u'execution_count'是必需属性》经验，为你挑选了1个好方法。 ... [详细]
程序员
在MySQL中查找至少2个元音的名称

如何解决《在MySQL中查找至少2个元音的名称》经验，为你挑选了1个好方法。 ... [详细]
程序员
如何避免java上的java.lang.NoClassDefFoundError:android/os/PersistableBundle？

如何解决《如何避免java上的java.lang.NoClassDefFoundError:android/os/PersistableBundle？》经验，为你挑选了1个好方法。 ... [详细]

360691894_8a5c48

这个屌丝很懒，什么也没留下！

关注作者

Tags | 热门标签

RankList | 热门文章

DevBox开发工具箱 | 专业的在线开发工具网站