My angularJS push option is not working. Could someone please tell me where I'm going wrong and a fix for it, please? I started learning this language only for a week now. Please excuse me if the error/mistake is silly.

Thank you

```
    <body ng-app="app" ng-controller ="Ctrl"  >

    <style>
        .alert{

            color: crimson;
            font-size: 19px;

        }
        .form{ 

            width: 72%;
            margin-left: 12%;
            border: 2px solid gold;
        }

    </style>

    <script>
                var app = angular.module("app", []);
                app.controller("Ctrl", function ($scope) {
                    $scope.main = [{"ngmail": "a.vanhala@evil.com", "pass": "thor", "cpass": "thor"}];

                    $scope.add = function ($scope) {
                        $scope.main.push($scope.sf);

                    };

                });
    </script>

    <div>    
        <div>    
            <form name="regform" class="form-horizontal" role="form" style=" margin: auto;" >
                <div class="form-group">
                    <label class="control-label  col-sm-2" for="email3">Email:</label>
                    <div class="col-sm-4">

                        <input type="email" class="form-control" placeholder="Enter email" id="email3" name="email" ng-model="sf.ngmail" required/>
                        <span class ="alert" ng-show=" regform.email.$touched && regform.email.$error.required"> Required</span>
                        <span class ="alert" ng-show=" !regform.email.$error.required && (regform.email.$touched && regform.email.$invalid)"> Invalid Email</span>
                    </div>
                </div>
                <div class="form-group">
                    <label class="control-label col-sm-2" for="pwd3">Password:</label>
                    <div class="col-sm-4">          
                        <input type="password" class="form-control" id="pwd3" placeholder="Enter password" ng-model="sf.pass" name="password" required/>
                        <span class ="alert" ng-show=" regform.password.$touched && regform.password.$error.required"> Required</span>

                    </div> 
                </div>

                <div class="form-group">
                    <label class="control-label col-sm-2" for="pwd4">Confirm password:</label>
                    <div class="col-sm-4">          
                        <input type="password" class="form-control" id="pwd3" placeholder="Enter password" ng-model="sf.cpass" name="cpassword" required/>
                        <span class ="alert" ng-show=" regform.cpassword.$touched && regform.cpassword.$error.required"> Required</span>

                    </div>
                </div>

                <div class="form-group">        
                    <div class="col-sm-offset-2 col-sm-10">
                        <div class="checkbox">
                            <label><input type="checkbox"> Remember me</label>
                        </div>
                    </div>
                </div>
                <div class="form-group">        
                    <div class="col-sm-offset-2 col-sm-10">
                        <button type="button" ng-click="add()" class="btn btn-default">Submit</button>
                    </div>
                </div>
            </form>
        </div>
    </div>    
    <br>   

    <div>

        <table border="1">
            <thead>
                <tr>
                    <th>Email</th>
                    <th>password</th>
                </tr>
            </thead>

            <tbody >
                <tr ng-repeat="m in main">

                    <td>{{m.ngmail}}</td>
                    <td>{{m.pass}}</td>
                </tr>
            </tbody>
        </table>

    </div>

</body>

```