Click here to Skip to main content
14,602,044 members
Rate this:
Please Sign up or sign in to vote.
Hello I want to change the color of the background of textarea with angular. I use the code below. I want to change the color when I select it. And when I choose it falls into this field, the color becomes red. But the color does not change in the interface.How to show interface change color?

What I have tried:

app.controller("myTextArea", function($scope) {
    $scope.myAreas = {
        "color" : "black",
        "background-color" : "red",
        "font-size" : "30px",
        "padding" : "100px"
Updated 30-Jul-20 16:59pm

1 solution

Rate this:
Please Sign up or sign in to vote.

Solution 1

You can achieve this using css itself.

For changing the color of textarea control (input), something like below:

.mat-form-field-empty.mat-form-field-label {
    color: green;

For changing the underline-color when it's highlighted-
.mat-form-field-underline {
    background-color: red;

Add this in styles.scss (or styles.css).

Alternatively, you can make use of themes: Angular Material UI component library[^]

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

CodeProject, 503-250 Ferrand Drive Toronto Ontario, M3C 3G8 Canada +1 416-849-8900 x 100