ng-class directive example

<!DOCTYPE html>
<html>
<head>
    <title>ng-class Example</title>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>

    <style>
        .class1 {
            color: white;
            background-color: #18a4a3;
            padding: 40px;
            font-family: "Courier New";
        }

        .class2 {
            background-color: coral;
            padding: 40px;
            color: white;
            font-family: Verdana;
        }

        .class3 {
            background-color: #ffd100 !important;
            padding: 40px;
            color: #333;
            font-family: Verdana;
        }

        .class4 {
            background-color: #2285ff;
            padding: 40px;
            color: #333;
            font-family: Verdana;
        }
    </style>
</head>
<body>
    <p>Select a class:</p>
    <div ng-app="">
        <select ng-model="color">
            <option value="" selected>Select Option</option>
            <option value="class1">Class1</option>
            <option value="class2">Class2</option>
            <option value="class3">Class3</option>
            <option value="class4">Class4</option>
        </select>
        <br />
        <div ng-class="color">
        <h1>Welcome to code-view.com !</h1>            
        </div>
    </div>  

</body>
</html>

[ng\:cloak],
[ng-cloak],
[data-ng-cloak],
[x-ng-cloak],
.ng-cloak,
.x-ng-cloak {
    display: none !important;
}

h1,
p {
    font-family: sans-serif;
}

{
  "name": "@plnkr/starter-angularjs",
  "version": "1.0.1",
  "description": "AngularJS starter template",
  "dependencies": {
    "angular": "^1.6.9"
  },
  "plnkr": {
    "runtime": "system",
    "useHotReload": false
  }
}