angularjs - Required field Validation on input on image button click

Answer 1

如果这不起作用，只需将其包装在一个<a>

<a data-ng-click="addAnswers($event)" style="text-decoration: none !important">
     <img src="/SaveBttn.png" style="width: 100px; height: 50px;" />
</a>

Answer 2

您必须在 addAnswers 操作中设置有效性。

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

app.controller("ctrl",function($scope){
  
  $scope.name = "";
  $scope.addAnswers = function($event,userForm){
    
    if($scope.name == ""){
       $scope.userForm["ProjectName"].$setValidity('empty', false);
      }
    else{
       $scope.userForm["ProjectName"].$setValidity('empty', true);
     
      }
    
    }
  
  })

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app" ng-controller="ctrl">
<form name="userForm">

                <table>
                    <tr>
                        <td>
                        <img src="/SaveBttn.png"
                                style="width: 100px; height: 50px;" data-ng-click="addAnswers($event)" />
                        </td>
                        <td>
                            <img alt="" onclick="Close()" src="/Close.png"
                                style="width: 100px; height: 50px;" />
                        </td>
                    </tr>
                </table>
        <div>
        <input type="text" required name="ProjectName" ng-model="name" placeholder="ProjectName" />
          <span ng-show="userForm.ProjectName.$error.empty">This feild is empty.</span>
</div>           
  </form>
  </div>