Required Validation in JavaScript AngularJS

<div class="form-group" ng-show="edit5" ng-hide="false">
    <label class="col-sm-2 control-label">
First Name:</label>
    <div class="col-sm-2">
        <input type="text" id="fname" name="fName" ng-model="fName" placeholder="First Name" class="form-control" />
    </div>
</div>
<div class="form-group" ng-show="edit5" ng-hide="false">
    <label class="col-sm-2 control-label">
Last Name:</label>
    <div class="col-sm-2">
        <input type="text" id="lname" name="lname" ng-model="lName" placeholder="Last Name" class="form-control" />
    </div>
</div>
<div class="form-group" ng-show="edit5" ng-hide="false">
    <label class="col-sm-2 control-label">
Phone Number:</label>
    <div class="col-sm-2">
        <input type="text" id="phone" name="phone" ng-model="phone" placeholder="Phone Number" class="form-control" />
    </div>
</div>
<div class="form-group" ng-show="edit7" ng-hide="false">
    <label class="col-sm-2 control-label" >
Image:</label>
    <div class="col-sm-2">
        <input class="file" type="file" file-model="myFile" id="myFile"/>
        <button type="button" ng-click="uploadFile()" class="btn btn-primary">
            <span class="glyphicon glyphicon-upload"> Upload File</span>
        </button>
        <br />
    </div>
</div>
<div class="col-sm-10" ng-show="remove" ng-hide="true" style="margin-left:150px">
    <img id="getimg" height="100px" width="100px" class="img-thumbnail col-xs-6 col-md-3" alt="Responsive image"/>
    <button type="button" class="btn btn-info" id="Remov" ng-click="removefile()" ng-show="remove1" ng-hide="false">
        <span
class="glyphicon glyphicon-remove"></span>Remove
    </button>
</div>
<div class="form-group" style="margin-left:300px">
    <input type="text" id="hid" name="hid" ng-model="hid" ng-hide="true" />
</div>
<button class="btn btn-primary" ng-click="SaveData()">
    <span class="glyphicon glyphicon-save"></span>Save Data

</button>
<button id="cbtn" class="btn btn-danger" ng-click="cancel()">
    <span class="glyphicon glyphicon-cancel"></span>Cancel

</button>undefined</div>

$scope.SaveData = function()
{
    strErrorMsg = "";
    var a = $("#hid").val();
    notEmpty(document.getElementById('fname'), '-Enter your First Name.');
    notEmpty(document.getElementById('lname'), '-Enter your Last Name.');
    notEmpty(document.getElementById('phone'), '-Enter your Phone Number.');
    ValidMno(document.getElementById('phone'), '-Enter Valid Phone Number.');
    if (strErrorMsg == '')
    {
        $.ajax({
            type: "POST",
            url: "User_Form.aspx/Data_Save",
            contentType: "application/json; charset=utf-8",
            data: JSON.stringify({
                id: $scope.id,
                firstName: $scope.fName,
                lastName: $scope.lName,
                phone: $scope.phone,
                photo: $scope.hid = a
            }),
            success: function(data) {
                $scope.LoadData();
                $("#hide").text('');
                $scope.$apply();
            }
        });
        $scope.edit3 = true;
        $scope.edit2 = false;
    }
    if (strErrorMsg != '')
    {
        $window.alert(' \n' + strErrorMsg);
    }
    else
    {
    }
};
function notEmpty(elem, helperMsg)
{
    if (elem.value == "")
    {
        strErrorMsg = strErrorMsg + helperMsg + "\n";
    }
}
function ValidMno(elem, helperMsg)
{
    if (elem.value !== "")
    {
        var phone = /^\(?([0-9]{3})\)?[-. ]?([0-9]{3})[-. ]?([0-9]{4})$/;
        if (!(elem.value.match(phone)))
        {
            strErrorMsg = strErrorMsg + '' + helperMsg + "\n";
        }
    }
}