0
ユーザーにスタイルを動的に設定させようとしていますが、特定のスタイルの値も取得したいと考えています。たとえば、ユーザーがH1要素の色を「オレンジ」に設定しているかどうかを確認したいとします。AngularJSを使用してスタイルを動的に設定するときにスタイルプロパティにアクセスする
マイHTML
<body ng-controller="mainController">
<h1 id="myH1">Hello World!</h1>
<textarea ng-model="outputCss"></textarea>
<style media="screen" type="text/css">
{{outputCss}}
</style>
</body>
私のJavascript、例ユーザー入力
var myH1Style = document.getElementById('myH1').style;
$scope.$watch('outputCss', function(newValue, oldValue){
if (myH1Style.color == "orange"){
alert("Nice work!");
}
console.log(myH1Style.color);
});
メインコントローラで
#myH1 {
color: orange;
}
h1 {
font-weight: 900;
}
問題は、条件が満たされず、コンソールログが常に空であることです。このメソッドを使用して追加されたCSSプロパティを表示するにはどうすればよいですか？