8wDlpd.png
8wDFp9.png
8wDEOx.png
8wDMfH.png
8wDKte.png

Angular ngStyle 指令不起作用:样式属性不会更新

myleftshoe 2月前

26 0

我正在尝试在 Angular 17 应用程序中使用 [ngStyle] 指令来动态显示或隐藏元素,如下所示:

...

我正在尝试在 Angular 17 应用程序中使用 [ngStyle] 指令来动态显示或隐藏元素,如下所示:

<div [ngStyle]="{visibility: loaded ? 'collapse' : 'visible' }">
    ...
</div>

我的组件中的布尔属性在 loaded 哪里

问题是:这不起作用。它 visibility 在开始时根据的初始值正确设置了属性 loaded ,但此后如果我在某个时候更改了 loaded visibility的值,则不会相应更改。我是不是错过了一些基本的东西?我也尝试过用 [style] 而不是, [ngStyle] 但结果完全一样。

编辑:这是我在组件中的导入:

imports: [
    NgIf,
    ProgressBarModule,
    NgStyle,
    CommonModule
  ],

编辑2:经过进一步测试,似乎Angular loaded 由于某种原因没有检测到属性的变化。如果我注入 ChangeDetectorRef 到组件并手动触发变化检测,如下所示:

this.loaded = true;
this.cdRef.detectChanges();

它开始正常工作。请注意,翻转属性的代码 loaded 位于 Promise ...内部,这可能是问题吗? Promise Angular 通常不会自动检测到块内部所做的更改吗?

帖子版权声明 1、本帖标题:Angular ngStyle 指令不起作用:样式属性不会更新
    本站网址:http://xjnalaquan.com/
2、本网站的资源部分来源于网络,如有侵权,请联系站长进行删除处理。
3、会员发帖仅代表会员个人观点,并不代表本站赞同其观点和对其真实性负责。
4、本站一律禁止以任何方式发布或转载任何违法的相关信息,访客发现请向站长举报
5、站长邮箱:yeweds@126.com 除非注明,本帖由myleftshoe在本站《angular》版块原创发布, 转载请注明出处!
最新回复 (0)
  • 我尝试过隐藏,但结果相同。我单独测试了“collapse”(没有 ngStyle,仅通过 CSS),它甚至在 div 上也能正常工作,所以问题出在其他地方……

返回
作者最近主题: