使用作用域变量时ngStyle绑定不起作用
ngStyle是Angular框架中的一个指令，用于动态绑定元素的样式。当使用作用域变量时，ngStyle绑定不起作用可能有以下几个原因：
- 作用域变量未正确绑定：确保作用域变量已经正确地绑定到模板中。可以通过在模板中输出变量的值来验证绑定是否成功。
- 作用域变量的值不满足ngStyle的要求：ngStyle指令要求作用域变量的值必须是一个对象，其中键是CSS属性，值是对应的样式值。确保作用域变量的值符合这个要求。
- 作用域变量的值没有变化：ngStyle只会在作用域变量的值发生变化时才会重新计算样式。如果作用域变量的值没有变化，ngStyle绑定不会起作用。可以通过在变量赋值之后手动触发变化检测来解决这个问题。
- 样式优先级的问题：如果同时存在多个样式设置，可能会出现样式优先级的问题。确保ngStyle绑定的样式优先级高于其他样式设置，可以使用!important来提高优先级。
- 其他可能的问题：如果以上方法都没有解决问题，可能是由于其他原因导致ngStyle绑定不起作用。可以尝试使用浏览器的开发者工具来检查元素的样式是否正确应用。
对于ngStyle绑定不起作用的问题，可以参考腾讯云的Angular文档，了解更多关于ngStyle的用法和示例：ngStyle - Angular指令
相关·内容
}}</div> <div class='col-1'><span [ngStyleconnection.mainLocation.realTime.hasRealTime }); }如您所见，我在其中一个div中使用了ngStyle，并希
浏览 1提问于2018-01-23得票数 0
4回答
item.percent_position}}%;"></div>当我使用style="width：{{ item.percent_position }%；“时，我得到了以下错误：
未明错误:评估不支持引号！
浏览 7提问于2017-12-05得票数 6
回答已采纳
我有一个组件，它有一个具有如下边框背景的伪元素类： ` border-bottom-color: attr(data-config-color); `此应用程序的标记如下所示：
<div class="arrow_box config" [attr.data-config-color]="(configData && configData.menu_bar_background ? config
浏览 0提问于2017-03-02得票数 1
我不能让jquery可调整大小来使用Angular和ng样式。我知道在创建可调整大小的元素时必须指定高度和宽度，但正如您从下面的jsfiddle中看到的那样，任何ng样式似乎都被忽略了，并且没有应用高度和宽度。
浏览 15提问于2016-08-18得票数 0
回答已采纳
当要更新的属性是与ngStyle或style.property绑定时，我无法使我的css转换工作<div class="bar" [style.width]="size +'%'"></div可以肯定的是，如果我移除html中的样式绑定并更新宽度on :hover，则转换可以正常工作。我错过了什么吗？
如果我让style.width绑定并将它悬停在ex.宽度:50%！重要的是，过渡有效。尽管这不是我想要实现的目标，但看起来
浏览 1提问于2016-10-11得票数 1
我试图在ngStyle中使用轻松属性，但它不起作用。组件中有颜色变量，我想这样使用它：
<div [ngStyle]="{color: schedule.group.color, background: 'lighten(' + schedule.group.color
浏览 5提问于2020-05-14得票数 3
回答已采纳
1回答
DomSanitizerthis.profileImage = this.sanitizer.bypassSecurityTrustStyle("url("+ data.photo + ")");Plunkr链接
浏览 3提问于2017-05-04得票数 0
回答已采纳
这里我的问题是，我想显示并隐藏基于json参数的文本框，这里我得到json值(true，false )，但是ng-show在绑定值时不能工作，谢谢您的帮助。
浏览 1提问于2016-01-05得票数 2
回答已采纳
我尝试将ngStyle绑定到ng-content，但不起作用，请参见下面的示例：
<ng-content select="panel-one" [ngStyle]="{'width':size+'px'
浏览 14提问于2016-07-26得票数 0
我在AngularJS中有一个具有自己独立作用域的跨域指令。作用域包含transclusiveDirectiveScopeVariable。template: '<div class="fancy"><ng-transclude></ngtransclude></div>');我想在指令的“外部模板”中使用作用域变
浏览 1提问于2016-03-19得票数 1
3回答
我发现了作用域的一个相当奇怪的行为:指令内部内容的真正类型： <mydir> </mydir> 所以return { link: function(scope){ }});
当我们将作用域定义为isolated
浏览 19提问于2016-01-21得票数 15
回答已采纳
1回答
我正在尝试使用组件更改css变量，但由于某些原因它不起作用，有帮助吗？//work but i dont want to use the property background.SCSS /*...*/
background: $my-var; HTLM： // does
浏览 19提问于2021-02-01得票数 0
should be between 5 and 7 chars" model="username" place-holder="username"> </form-field>
我遇到的问题是我无法将输入变量值绑定到父范围变量在小提琴中，绑定到父作用域根本不起作用，在localhost上，指令变量在父作用域变量之后！例如
浏览 0提问于2013-02-28得票数 1
回答已采纳
如何在角2的样式标记中使用组件变量？对样式使用属性绑定效果很好，但是对于几个子元素，特别是当它们嵌套在其他子组件中时，这会得到相当好的效果。ngStyle=属性也只处理单个元素。但是这不起作用。
类似的问题还没有回答这个问题，只显示了作为解决方案的属性<
浏览 4提问于2016-11-25得票数 9
我试图在对象变量中使用NgStyle指令，如下所示： template: ` })
private object: string = "{background-color: 'white'}";我也尝试过使用object = "backgrou
浏览 4提问于2016-11-09得票数 12
回答已采纳
我试着理解单向绑定和插值之间的区别，发现对于ngClass，这两者似乎是等价的，但对于ngStyle，我无法使用插值来使其工作(只有绑定有效)。下面注释掉的ngStyle语法对我来说都不起作用。我错过了什么吗？非常感谢！ {注意:所有被注释掉的东西都是这样的，否则就会破坏代码}。--label>Bar:</label>
<input value="Bar" ngStyle="{{s
浏览 38提问于2019-04-10得票数 1
以下内容不起作用。目前使用材料文本框。实际代码： <mat-label>Test</mat-label> matInput
[ngStyle
浏览 4提问于2020-07-29得票数 0
回答已采纳
我有一个angular项目，它将把外部HTML从字符串变量加载到当前具有控制器作用域的div中。现在HTML加载了，但是我最终看到像{{myvar}}这样的东西呈现为文本，而不是呈现限定了作用域的变量。
浏览 2提问于2013-10-11得票数 0
因此，我理解我的代码由于ng-repeat指令创建的作用域而失败。我自己的指令创建了一个隔离作用域，并对父作用域中的对象执行双向数据绑定。我的指令将为这个绑定变量分配一个新的对象值，当我的指令不使用ng-repeat (父变量被正确更新)时，它将完美地工作。所以我希望我可以使用优先级来确保我的指令先运行，最后创建一个隔离作用域，当ng-repea
浏览 0提问于2013-03-25得票数 95
回答已采纳
我有点困惑为什么ngStyle不能像预期的那样工作。我正在遵循Brad Traversy在Udemy上的一个教程，我们被指导像这样使用ngStyle： <h3 [ngStyle]="currentStyles" >{{user.firstName}} {但是，ngStyle似乎只在第一次渲染时求值，而不会在组件的属性更改时更新。我找到的解决方案是创建一个返回函数作用域变量的方法： getCurrentS
浏览 20提问于2021-04-01得票数 0
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
对象存储
云直播活动推荐
腾讯云开发者
