How to use ng-class to apply different styles to an element based on a condition in angularJS

<div ng-app="classApp" ng-controller="ClassController">
    <p ng-class="{ 'red-text': isError, 'green-text': !isError }">This text changes color based on the condition.</p>
    <button ng-click="toggleError()">Toggle Error</button>
</div>

<style>
    .red-text {
        color: red;
    }

    .green-text {
        color: green;
    }
</style>

<script>
    var app = angular.module('classApp', []);
    app.controller('ClassController', function($scope) {
        $scope.isError = false;

        $scope.toggleError = function() {
            $scope.isError = !$scope.isError;
        };
    });
</script>