I am currently working on a straightforward program where the user inputs text into a textbox, and that text is displayed below. However, I also want the font color to change based on what the user types in the "color" field. Why isn't this functionality working as expected?
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="style.css">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
</head>
<body>
<div ng-app="">
<textarea name="message" rows="10" cols="30" ng-model="writing">
</textarea>
<span> Color: <input type = "text" ng-model="marker_color"></span>
<br>
<br>
<div id="whiteboard" ng-bind="writing" style="color:{{marker_color}}"></div>
</div>
</body>
</html>
I have attempted various approaches like adding spaces around 'marker_color', including a semicolon after the variable, trying both 'font-color' and 'color', but none of them seem to have resolved the issue.
While looking for solutions, I noticed that most discussions involve more advanced AngularJS concepts. My implementation is basic and should ideally work without any complications.