A demo of ng-class with a div and textbox

HTML / AngularJS Code
Output
<!DOCTYPE html>
<html>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.13/angular.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css">
<style>
.redclass {
    color:#D50000;
    background-color:#FFE1E1;
    border: 2px solid #FF5353;
    font-size:20px;
    width:300px;
    }
.blueclass {
    color:#004A95;
    background-color:#C4E1FF;
    border: 2px dashed #64B1FF;
    font-size:20px;
    width:300px;
    }
.greenclass {
    color:#008040;
    background-color:#BBFFDD;
    border: 2px dotted #4FFFA7;
    font-size:20px;
    width:300px;
    }
.yellowclass {
    color:#D9D900;
    background-color:#FFFF84;
    border: 2px solid #757500;
    font-size:20px;
    width:300px;
    }
</style>
<body ng-app="">

        <h4>Enter a class name from available classes:</h4>

        <div class="form-group col-sm-2">
          <input type="text" class="form-control" placeholder="redclass greenclass yellowclass blueclass" ng-model="ngclassdemo">
        </div>
        <br /><br />


        <div ng-class="ngclassdemo">
          <h3>This is a ng-class demo!</h3>
        </div>

</body>
</html>