【发布时间】：2015-02-02 19:59:03
【问题描述】：
所以我这几天一直在尝试解决这个问题，但似乎无法找到一个好的解决方案。
当我向 AngularJS 元素指令添加一个类时，样式会显示在浏览器 (Chrome) 代码视图中，但不会呈现样式。
我正在尝试为我的自定义指令元素“sss”添加背景颜色。
这是我的源代码：
_home-header.html（这是我使用元素指令“sss”的地方）
<div class="home-dash-wrapper">
<tone-today></tone-today>
<div class="home-dash">
<set-tone></set-tone>
<sss></sss>
</div>
</div>
_sss.html（这是元素指令的模板）
<div class="sign-in">
<span>Welcome Anonymous | </span><span class="sign-in-button">Sign In</span>
</div>
_sss.scss（应用样式的 sass 样式表）
sss{
background-color: #E9E9EA;
}
.sign-in{
width: 100%;
padding: 10px;
text-align: right;
}
_home.js（AngularJS 指令声明）
var app = angular.module('tone-home', []);
app.directive('sss', function () {
"use strict";
return {
restrict: 'E',
templateUrl: 'app/src/templates/modules/_sss.html'
};
});
Chrome 屏幕截图（请注意如何在元素“sss”上设置背景颜色，但它没有在浏览器中呈现。“欢迎匿名 | 登录”文本应被此背景颜色包围因为该文本位于“sss”元素内。）
【问题讨论】：
-
确实是奇怪的行为，你能在 plunker 中复制这个问题吗？
-
另外，您是否尝试过使用类来代替？ .sss{ 背景颜色：#E9E9EA; } 和
-
我正在为我工作的公司编写这段代码，所以我宁愿不提供比我拥有的更多的东西（我必须这样做才能成为一个笨拙的人）。但是，如果从我给出的内容中找不到解决方案，那么我可能会继续做一个。是的，我尝试过使用类。那也行不通……
-
我们需要查看呈现在浏览器调试器中的 DOM 元素，而不是共享您的视图和指令。
-
@Enzey 关于浏览器忽略标签的假设是正确的。
标签： javascript html angularjs angularjs-directive sass