Loading [MathJax]/jax/output/CommonHTML/config.js
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
社区首页 >问答首页 >CSS不会在组件模板中应用

CSS不会在组件模板中应用
EN

Stack Overflow用户
提问于 2014-05-29 04:25:15
回答 1查看 102关注 0票数 1

我有下表组件,我使用angulardart 0.11和省1.4

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
     @Component(
            selector: 'table-component',
            publishAs: 'ctrl',
            template: '''<table class="table table-striped table-bordered table-condensed">
                            <thead>
                               <tr>
                                 <th ng-repeat="col in ctrl.ItemsSource.ColumnDefs">{{col.displayName}}</th>
                               </tr>
                            </thead>
                             <tbody>
                               <tr ng-repeat="item in ctrl.ItemsSource.Items">
                                 <td ng-repeat="col in ctrl.ItemsSource.ColumnDefs">
                                    {{item.properties[col.name].value}} 
                                 </td>
                               </tr>
                            </tbody>
                         </table>'''
        )
        class TableComponent {

             Scope scope;
             ItemsCollection ItemsSource;

         TableComponent(this.scope) {

           var columnDefs =[new ColumnDef(name:"id",displayName:"ID",isPrimaryKey:true),
                            new ColumnDef(name:"firstname",displayName:"First Name"),
                            new ColumnDef(name:"lastname",displayName:"Last Name"),
                            new ColumnDef(name:"language",displayName:"Language")];

           var items = [new DynamicItem({'id':new DynamicProperty<int>('id',0),
                                         'firstname':new DynamicProperty<String>('firstname','Some'),
                                         'lastname':new DynamicProperty<String>('lastname','One'),
                                         'language':new DynamicProperty<String>('language','English')}),
                        new DynamicItem({'id':new DynamicProperty<int>('id',1),
                                         'firstname':new DynamicProperty<String>('firstname','Another'),
                                         'lastname':new DynamicProperty<String>('lastname','One'),
                                         'language':new DynamicProperty<String>('language','Italian')})];

           this.ItemsSource = new ItemsCollection(columnDefs,items);


       }
 }

模板有一些应用的引导css类,但是当它被呈现时,css不会在组件中应用,下面是我得到的

第一个表来自组件,第二个表是html表,它们都应用了相同的css类,那么为什么css类不应用到我的组件中呢?

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2014-05-29 04:55:01

当您将引导CSS添加到页面中时,它将无法工作。默认情况下,Angular.dart组件围绕组件内容创建一个shadowDOM。引导程序不支持shadowDOM,选择器也不会进入shadowDOM。

您可以设置属性useShadowDom: false (如selectorpublishedAs、.)创建没有shadowDOM的组件。

或者,您可以使用属性cssUrl向组件添加引导CSS,这使它们具有作用域样式。您需要将此添加到每个组件中。浏览器每次都应该识别出它的URL是相同的,并且只获取一次文件。

票数 4
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/23933278

复制
相关文章
JS 函数中的 arguments 类数组对象
众所周知,js 是一门非常灵活的语言。当我们在 js 中调用一个函数时,经常会给函数传递一些参数,js 把调用函数时传入的全部实参存储到一个叫做 arguments 的类数组对象里面
很酷的站长
2022/12/04
5.5K0
JS 函数中的 arguments 类数组对象
js中的对象
面向对象编程(Object Oriented Programming,缩写为 OOP)是目前主流的编程范式。它将真实世界各种复杂的关系,抽象为一个个对象,然后由对象之间的分工与合作,完成对真实世界的模拟。
用户4940950
2019/03/26
7K0
JS中对象+构造函数+原型对象谈恋爱了嘛。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <script> function Person(myName,myAge) { this.name=myName; this.age=myAge; this.currentType="构造函数中的属性"; this.say=function() { console.log("构造函数里面的方法");
贵哥的编程之路
2020/10/28
1.2K0
JS中对象+构造函数+原型对象谈恋爱了嘛。
JS-比较函数中嵌套函数,可以排序【对象数组】
1 function createCompareFun(propertyName){ 2 return function(object1,object2){ 3 var value1 = object1[propertyName]; 4 var value2 = object2[propertyName]; 5 if(value1>value2){
xing.org1^
2018/05/17
4.9K0
js中对象
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>03_对象</title> </head> <body> <!-- 1. 什么是
李才哥
2020/03/28
9K0
js中的函数
console.log(fn instanceof Object) // 是Object类型的实例
李才哥
2020/08/17
6.5K0
js中的函数
js中的函数
console.log(fn instanceof Object) // 是Object类型的实例
李才哥
2020/03/28
5.3K0
js中的函数
js---对象 和 函数this
   当函数被保存为一个对象的属性时,它就可称为这个对象的方法。当一个方法被调用时,this被绑定到这个对象上。如果调用表达式包含一个提取属性的动作(. 或 []),那么它被称为方法调用。例如:
小蔚
2019/09/11
1.3K0
直接写和放在函数中不同的R语言用法
df$A可以索引数据框df中列名为A的列的所有值。那么假如列名是一个R对象怎么做?
生信宝典
2022/01/19
1.9K0
JavaScript中的函数、对象
JS中的函数 声明方式 方式一 function 函数名(){ 函数体 } 方式二 var 函数名=function(){ 函数体 } 方式三 var 函数名=new
时间静止不是简史
2020/07/24
2.7K0
JavaScript中的函数、对象
Js中Symbol对象
ES6引入了一种新的基本数据类型Symbol,表示独一无二的值,最大的用法是用来定义对象的唯一属性名,Symbol()函数会返回symbol类型的值,该类型具有静态属性和静态方法,其静态属性会暴露几个内建的成员对象,它的静态方法会暴露全局的symbol注册,且类似于内建对象类,但作为构造函数来说它并不完整,因为它不支持语法new Symbol()。每个从Symbol()返回的symbol值都是唯一的,一个symbol值能作为对象属性的标识符。
WindRunnerMax
2020/10/26
5.1K0
Js中String对象
创建一个字符串可以通过字面量的方式,通过字面量创建的字符串变量在调用方法的时候能够自动转化为临时的包装对象,从而能够调用其构造函数的原型中的方法,也可以利用String对象生成字符串对象,此外在ES6标准还定义了模板字面量用以生成字符串的方式。
WindRunnerMax
2020/09/18
7.7K0
Js中Proxy对象
Proxy对象用于定义基本操作的自定义行为,例如属性查找、赋值、枚举、函数调用等。
WindRunnerMax
2020/11/24
2.6K0
JS中Arguments对象
arguments对象是所有(非箭头)函数中都可用的局部变量。你可以使用arguments对象在函数中引用函数的参数。此对象包含传递给函数的每个参数,第一个参数在索引0处。例如,如果一个函数传递了三个参数,你可以以如下方式引用他们:
Caleb
2020/11/03
2.2K0
Js中Reflect对象
Reflect是ES6起JavaScript内置的对象,提供拦截JavaScript操作的方法,这些方法与Proxy对象的handlers中的方法基本相同。
WindRunnerMax
2020/11/26
3.7K0
小程序的登录逻辑能否放在app.js中实现?
前言:做小程序开发的同学,可能都会考虑一个问题,用户登录这个方法是公用的,我们应该把这个方法放在哪里最合适呢? 看到上面的问题后,很大一部分刚入门同学都会直接把登录方法放在app.js里,并且有些同
连胜
2018/03/22
3.6K0
小程序的登录逻辑能否放在app.js中实现?
Js中Date对象
JavaScript的Date对象是用于处理日期和时间的全局对象,Date对象基于Unix Time Stamp,即自1970年1月1日UTC起经过的毫秒数。
WindRunnerMax
2020/10/26
21.4K0
Js中Math对象
Math是一个内置对象,它拥有一些数学常数属性和数学函数方法,Math用于Number类型,其不支持BigInt。
WindRunnerMax
2020/10/10
5.2K0
Js中Array对象
JavaScript的Array对象是用于构造数组的全局对象,数组是类似于列表的高阶对象。
WindRunnerMax
2020/10/26
9.9K0
Js中Number对象
JavaScript的Number对象是经过封装从而能够处理数字值的对象,Number对象由Number()构造器以及字面量声明的值在转化为包装对象时创建,JavaScript的Number类型为双精度IEEE 754 64位浮点类型。
WindRunnerMax
2020/10/10
3.4K0

相似问题

将对象放在键列表中。纯JS

211

如何将对象放在js中的HashMap中?

30

不应将JS函数声明放在块中。

11

自动释放在函数调用中创建的对象

34

将函数放在对象中的最好方法?

13
添加站长 进交流群

领取专属 10元无门槛券

AI混元助手 在线答疑

扫码加入开发者社群
关注 腾讯云开发者公众号

洞察 腾讯核心技术

剖析业界实践案例

扫码关注腾讯云开发者公众号
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
查看详情【社区公告】 技术创作特训营有奖征文