CSS类选择器可以应用于组件吗？

我有以下Plunker使用ui-router和Angular的1.6x新组件功能。CSS类选择器可以应用于组件吗？

状态'userRegister'变为活动状态，然后初始化'userRegister'组件。该组件将一个新的<user-register/>注入到<ui-view>中，然后注入ng-template脚本块的HTML内容，这一切都正常。

最终DOM结束是：

<ui-view class="ng-scope"> 
    <user-register class="ng-scope ng-isolate-scope"> 
     <h1 class="header">Create account</h1> 
    </user-register> 
</ui-view>

不过，我不能找到一种方法，一个CSS类选择添加到<user-register/>标签。

例如使用类选择叫.example我想实现以下目标：

<user-register class="example ng-scope ng-isolate-scope">...<user-register/>

任何想法吗？

来源

2017-04-06 I am me

有没有这样的事情一个CSS类。 CSS有规则集，选择器，类选择器，规则和属性（所有这些有时被错误地称为“CSS类”）。 HTML有实际的类。 – Quentin

@Quentin：当然会尝试更新为'类选择器' –

@Iamme你不能只在你的模板里面有一个div（应用你的类）并且保持你的内容的所有内容来实现类似的行为？ – tanmay

当然，你总是可以将模板包装在一个div上，并把类放在那里。

如果不想这样做，你可以注入$element和使用$postLink函数添加你需要的类：

.component('userRegister', { 
    templateUrl: '/views/user-register', 
    controller: function($element) { 
     this.$postLink = function() { 
     $element.addClass('example'); 
     } 
    } 
})

这里是工作plunker：

https://plnkr.co/edit/VuWu8L9VqrgJRGnxItY2?p=preview

Final DOM：

<user-register class="ng-scope ng-isolate-scope example"> 
    <h1 class="header">Create account</h1> 
</user-register>

来源

2017-04-06 12:42:21 Fedaykin

出于兴趣，您是否碰巧知道$ postLink方法和$元素的详细API引用的位置？我看过Angular网站，但只能找到开发人员指南中提到的$ postLink函数。 –

对于任何感兴趣的人：'$ postLink'被称为_lifecycle hook_。关于这个钩子和其他的一些信息可以通过后面的链接找到，尽管我还没有找到一个全面的解释（如果你发现任何像样的东西，请分享）：[Todd的Angular 1.5生命周期钩子]（https：// toddmotto的.com /角-1-5生命周期钩＃postlink） –

CSS类选择器可以应用于组件吗？

回答

相关问题