gpt4 book ai didi

typescript - Angular2 @HostBinding 无法绑定(bind)背景图像样式

转载 作者:太空狗 更新时间:2023-10-29 17:50:40 26 4
gpt4 key购买 nike

<分区>

使用 @HostBinding 时将属性绑定(bind)到我的组件的背景图像,当我指定图像 URL 时它不起作用。

Angular2 RC-1 的第一个例子:

import {Component, HostBinding} from "@angular/core";

@Component({
selector: 'demo',
template: 'something'
})
export class DemoComponent {

@HostBinding('style.background-image')
backgroundImage = 'url(http://placekitten.com/g/200/300)';
}

检查 DOM 时,我们可以找到 <demo>something</demo> ->不好


第二个例子:

import {Component, HostBinding} from "@angular/core";

@Component({
selector: 'demo',
template: 'something'
})
export class DemoComponent {

@HostBinding('style.background-image')
backgroundImage = 'none';
}

这一次,在检查 DOM 时,我们可以找到 <demo style="background-image: none;">something</demo> -> 好


我试过 background而不是 background-image , 它适用于类似 "blue" 的颜色但仍然不适用于 URL。

我还尝试稍后使用 setTimeout 动态更改值里面ngAfterViewInit() , 它在从 "none" 更改时有效至 "blue" , 但不使用 URL,值保持 "none" .

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