角度2 - クエリ文字列が存在する場合、別のスタイルシートを読み込みます

Question

私はAngular 2アプリを持っており、クエリ文字列widget=trueが存在する場合、私のコンポーネントの1つをiframeウィジェットに変換します。この文字列が存在する場合、ウィジェットビューを少し変更するために、コンポーネントに追加のスタイルシートをロードします。これは可能ですか？どうすればいい？ただ、明確にする

：

私は、通常のページとして使用しますが、あまりにもiframeのウィジェットとしてそれを持ってできるようにしたいコンポーネントを持っています。クエリ文字列widget=trueが存在すると、そのページがiframe内にあることがわかります。この場合、コンポーネントに追加のスタイルシートをロードします。

Answer 1

最初は明らかで汚れていて、<style>タグのスタイルを含めて、*ngIfというURLでこのパラメータをチェックしています。

第二には、私が良く見つける何、setting the style into styleUrls component meta propertyです：

let styleUrls = []; 

if (window.location.href.contains('widget=true')) { 
    styleUrls.push('/path/to/style'); 
} 

@Component({ 
    selector: 'hero-app', 
    template: ` 
    <h1>Tour of Heroes</h1> 
    <hero-app-main [hero]=hero></hero-app-main>`, 
    stylesUrls: 
}) 
export class HeroAppComponent { 
/* . . . */ 
}