Javascript 如何将样式添加到根组件dom元素（角度选择器组件）_Javascript_Css_Angular_Typescript_Sass

Javascript 如何将样式添加到根组件dom元素（角度选择器组件）

javascript css angular typescript sass

Javascript 如何将样式添加到根组件dom元素（角度选择器组件）,javascript,css,angular,typescript,sass,Javascript,Css,Angular,Typescript,Sass,我有以下组成部分： // Typescript @Component({ selector: 'form-button', templateUrl: './form-button.component.html', styleUrls: ['./form-button.component.scss'] }) export class FormButtonComponent {} //form-button.component.html <div class="for

我有以下组成部分：

// Typescript
@Component({
    selector: 'form-button',
    templateUrl: './form-button.component.html',
    styleUrls: ['./form-button.component.scss']
})
export class FormButtonComponent {}

//form-button.component.html
<div class="form-button-wrapper">
    <div class="content"></div>
</div>

//form-button.component.scss
.form-button-wrapper {
    width: 100%;
    height: 100%
}

//类型脚本
@组成部分({
选择器：“表单按钮”，
templateUrl:'。/form button.component.html'，
样式URL:['./表单按钮.component.scss']
})
导出类FormButtonComponent{}
//form-button.component.html
//form-button.component.scss
.表单按钮包装{
宽度：100%；
身高：100%
}

在html中，将如下所示：

<head>...</head>
<body>
    ....
    <form-button>
         <div class="form-button-wrapper">
             <div class="content"></div>
         </div>
    </form-button>
    ....
</body>

。。。
....
....

我想为

而不是

定义宽度和重量

我如何才能做到这一点？

是的，只需使用

:host

选择器即可。它使您可以访问环绕角度元素

//form-button.component.scss

:host {
 // insert your styles here
}

.form-button-wrapper {
    width: 100%;
    height: 100%
}

使用

：主机

选择器@弗拉基米尔博戈莫洛夫很好！你能把它写成一个正确的答案吗？读这篇旧帖子，你会得到你的答案：）