JSFiddle - React, Tailwind, and code Playground

HTML

<script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.0.7/angular.min.js"></script>
<form ng-controller="a" name="aForm">
    {{aForm.$pristine}}
    <div ng-form ng-controller="b" name="bForm">
        {{bForm.$pristine}}
        <input type="text" ng-model="coco" />
    </div>
    <div ng-form ng-controller="b" name="bForm">
        {{bForm.$pristine}}
        <input type="text" ng-model="item.coco" ng-repeat="item in items" />
    </div>
    <div ng-form ng-controller="b" name="bForm">
        {{bForm.$pristine}}
        <input type="text" ng-model="coco" />
    </div>
    <button type="button" ng-click="caca()">Do it !</button>
</form>

JavaScript

var app = angular.module('app', []);

app.controller('a', function($scope) {
    $scope.caca = function() {
        $scope.$emit('resetForm');
    }
});

app.directive('form', function() {
    return {
        restrict: 'E',
        link: function(scope, iElem) {
            scope.$on('resetForm', function() {
                iElem.find('[ng-model]').andSelf().add('[ng-form]').each(function(i, elem) {
                    var target = $(elem).addClass('ng-pristine').removeClass('ng-dirty');
                    var control = target.controller('ngModel') || target.controller('form');
                    control.$pristine = true;
                    control.$dirty = false;
                });
            });
        }
    };
});

app.controller('b', function($scope) {
    $scope.items = [{}, {}, {}];
});

angular.bootstrap(document, ['app']);