Отправить форму, используя тег ссылки с angularjs

Я все еще новичок в angularJS. Я пытался создать пользовательскую кнопку и прикрепить ее к моей форме вместо обычной кнопки. Я пробовал пару подходов, и до сих пор никто из них не работал хорошо. теперь, когда я нажимаю кнопку ввода внутри поля ввода, я получаю представление "результаты", полностью загруженное на главную страницу. но когда я нажимаю кнопку тега "а" кнопки поиска, просмотр загружается, а затем исчезает мгновенно. а также расположение браузера изменяется на "результаты", а затем возвращается только к "/#/". Я понятия не имею, почему и что вызывает это.

вот мой html:

<div id="search-container" ng-controller="SearchController">
  <form ng-submit="submitQuery()">
    <div>
      <input id="keywords" name="keywords" ng-model="query.keywords"  placeholder="please enter query" value="" required/><br>
      <a href="#" id="search-btn" ng-click="submitForm()"><img src="/Images/search-icon.png" alt="Search" title="Search" /></a>
    </div>
  </form>
</div>

вот мой контроллер модели и ngjs:

var bfapp = angular.module("blogfinder", []).config(function ($routeProvider) {
  $routeProvider.when('/results', {
    templateUrl: 'PartialViews/results.html',
    controller: 'ResultsController'
  });

  $routeProvider.otherwise({ redirectTo: '/' });
});

bfapp.controller('ResultsController', function ($scope) {
});

bfapp.controller('SearchController', function ($scope, $location) {
  $scope.query = { keywords: "" };

  //on form submit
  $scope.submitQuery = function () {
    if ($scope.query.keywords !== null) {
      $location.path('/results');
    }
  };

  //on button click
  $scope.submitForm = $scope.submitQuery;
});

Ответ 1