更改某個角度中某個組件的佈局寬度

Question

是否有可能只更改所選組件中佈局的寬度？我只想在我的登錄組件中更改<div class="page home-page">？只在登錄組件而不在其他組件上。

Answer 1

指令可以是你的問題的解決方案。

的src /應用/ width.directive.ts

import { Directive, ElementRef, Input } from '@angular/core'; 

@Directive({ selector: '[width]' }) 
export class widthDirective { 

    @Input() 
    set width(width: number) { 
     this.el.nativeElement.style.width = `${this._width}px`; 
    } 

    constructor(el: ElementRef) {} 
} 

然後在任何組件，您可以使用：

<div class="page home-page" width [width]="500"> 

如果你想使你的指令，任何地方訪問你可以按照this answer。

Answer 2

在角2/4所有樣式（除全球主要的樣式表）封裝，所以當你包括像這樣的樣式表：

@Component({ 
    selector: 'component-name', 
    templateUrl: './component.html', 
    styleUrls: ['./component.css'] 
}) 

從component.css所有樣式將只適用於component.html（如果你不使用像/deep/和相同的東西）。所以隨意更改當前佈局的寬度，不會影響其他佈局！