JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/1.1.3/sweetalert.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/1.1.3/sweetalert.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.9/angular.min.js"></script>
<script type="text/javascript" src="https://oitozero.github.io/ngSweetAlert/SweetAlert.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.2.18/angular-ui-router.min.js"></script>

<script>
    var app = angular.module("myapp", ["ui.router","oitozero.ngSweetAlert"]);

app.config(function($stateProvider) {
    $stateProvider
        .state('home', {
            template: "<h2>home</h2>"
        })
        .state('form', {
            template: '<form name="formname" confirm-leave>'+
    				'<br><br>type something in the text area and then go back to home<br>'+
						'<textarea ng-model="model"></textarea>'+
    				'</form>'+
    				'<pre>form $dirty: {{formname.$dirty}}</pre>'
        })
        
});   
    
app.directive('confirmLeave',function(){
    return {
        restrict:"A",
        controller:function($scope,$attrs,SweetAlert,$state,$location){
            $scope.$on('$destroy', function() {
                window.onbeforeunload = undefined;
            });
            $scope.$parent.$on('$stateChangeStart', function(event, next, current) {
                console.log($scope.formname.$dirty)
								
                if($scope.formname.$dirty){
                event.preventDefault()
                    SweetAlert.swal({
                            title: "Are you sure you want to leave this page?",
                            text: "Some changes have not been saved.",
                            type: "warning",
                            showCancelButton: true,
                            confirmButtonColor: "#DD6B55",confirmButtonText: "Ok",
                            cancelButtonText: "Cancel",
      ...