gpt4 book ai didi

angularjs - 在运行时在 AngularJs 中更改背景图像的最佳方法

转载 作者:行者123 更新时间:2023-12-01 06:22:27 25 4
gpt4 key购买 nike

我想创建通用功能,允许我更改任何部分的背景图像。经过提供的选项后,我找到了这两种方法。想要选择更改图像的最佳方法,因为在单个页面上我想要多次更改背景设施。它将提供给四到五个部分。

联系方式

  • 使用指令检查此堆栈溢出 link .
  • 还有另一种 Angular 范围变量的方法,我们可以在运行时更新。
    <div ng-style="{'background-image': 'url(/images/' + backgroundImageUrl + ')'}"></div>

  • 所需用法 (关于指令)
    <body>
    <section backgroundImage url="{{backgroundImageUrl1}}">
    ...
    </section>
    <section backgroundImage url="{{backgroundImageUrl2}}">
    ...
    </section>
    <section backgroundImage url="{{backgroundImageUrl3}}">
    ...
    </section>
    <section backgroundImage url="{{backgroundImageUrl4}}">
    ...
    </section>
    </body>

    如上图我要更新 背景图片每个部分的属性。如果在 CSS 文件中设置这些属性,它将减少加载图像的时间,即如果我们直接在 HTML 中添加内联 css 样式,所有图像都将在 DOM 加载时加载。它将向服务器发出额外请求以获取图像并将其加载到 DOM 中。我想遵循可以减少我的 SPA(单页应用程序)中加载时间的策略。

    最佳答案

    我想和<div ng-style="{'background-image': 'url(/images/' + backgroundImageUrl + ')'}"></div>一起去应该更有效。

    您不会引入另一层复杂性,指令创建范围,观察和消化,而且指令必须在开始时编译。

    使用符号 ng-style连同来自 Controller 属性的一些特定 url 应该只请求那个特定的事件图像。因此,我认为它应该是最佳解决方案。

    关于angularjs - 在运行时在 AngularJs 中更改背景图像的最佳方法,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32066399/

    25 4 0
    Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
    广告合作:1813099741@qq.com 6ren.com