无法在 AngularJS 中更改 CSS 样式
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/24365428/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Can't change CSS style in AngularJS
提问by ClmentM
For some reasons, I can't change the style of an element using the following :
由于某些原因，我无法使用以下内容更改元素的样式：
angular.element("#element").style.height = 100px;
I'm sure that angular.element("#element")works, as it returns a DOM element. Plus, this works :
我确信这angular.element("#element")有效，因为它返回一个 DOM 元素。另外，这有效：
angular.element("#element").addClass('something');
(Everything I've found is about ngStyle but I don't think it is what I'm looking for ?)
（我发现的一切都是关于 ngStyle 的，但我认为这不是我要找的？）
Should I use something else ?
我应该用别的东西吗？
If so :
What ?
Why .style.somethingdoesn't work ?
如果是这样：什么？为什么.style.something不起作用？
回答by gkalpak
According to the docs:
根据文档：
Note: all element references in Angular are always wrapped with jQuery or jqLite; they are never raw DOM references.
注意：Angular 中的所有元素引用总是用 jQuery 或 jqLite 包裹；它们从来都不是原始的 DOM 引用。
So the .styleproperty is not available directly, since it is a property of the wrapped HTMLElement.
所以该.style属性不能直接使用，因为它是被包装的属性HTMLElement。
You can either use ivarni's approach to get hold of the HTMLElement (angular.element(...)[0].style...) or use jQuery's/jqLite's .css()method:
您可以使用 ivarni 的方法来获取 HTMLElement ( angular.element(...)[0].style...) 或使用 jQuery/jqLite 的.css()方法：
angular.element('#element').css('height', '100px');
回答by ivarni
Angular's elementreturns something that wraps a DOM element, not the DOM element itself.
You can access the underlying element much like you would with a JQuery selector.
Angularelement返回一些包装 DOM 元素的东西，而不是 DOM 元素本身。您可以像使用 JQuery 选择器一样访问底层元素。
angular.element("#element")[0].style.height = 100px;
That of course assumes you've got one match, which you should when using an ID.
这当然假设您有一个匹配项，在使用 ID 时应该这样做。
回答by Mehdi Karamnejad
If you are running Angular without jQuery, this works:
如果您在没有 jQuery 的情况下运行 Angular，则此方法有效：
angular.element(document.querySelector("#element"))[0].style.height = "100px";
I have tested this in an ionic application.
我已经在离子应用程序中对此进行了测试。
