1
私はAngular 2を使用して非常に簡単なWebアプリケーションを作成していますが、ユーザーにRGBカラーコードの入力を求めています。ユーザがコードを入力した後、ページ背景は入力カラーに変わるはずです。コンポーネントの範囲外のスタイルを更新する - 角度2
現在、これは私が私のapp.component.tsファイルに持っているものされています
/**
* Fired when the user clicks the #update-background button. This function will read the current input values and set the background color to these values.
*
* @param rgb: RGB object bound to the input fields. Holds the rgb(,,) values for the new background
*/
updateBackgroundColor(rgb) {
// 1. Construct the new background color
var updatedBackgroundColor = "rgb(" + rgb.r + "," + rgb.g + "," + rgb.b + ")";
// 2. Set the background of the <body> to the new background color. Right now I am using direct DOM manipulation because I could not find a way to access the <body> via typescript.
document.body.style.background = updatedBackgroundColor;
}
<body>要素のスタイルを更新するには、この最善の方法ですか？コードは現在作業中ですが（demo）、これは<body>要素にtypescriptとAngular 2でアクセスする最も効率的な方法であることを確認したいだけです。
さらに詳しい説明が必要な場合は、chrome開発ツールを使用して、apple.comのようなウェブサイトを調べます。これらのサイトは要素のstyle属性でアニメーションを更新します。 – Ash