我如何在onclick事件后执行angular脚本

Question

下面是我的html代码:

    <div ng-app="myApp" ng-controller="customersCtrl"> 
      <p id="druzyny"></p>
    </div>

，然后在angular脚本中:

        var app = angular.module('myApp', []);
        document.getElementById("search1").onclick = app.controller('customersCtrl', function($scope, $http){
        var place = document.getElementById("place").value;
        var sel1 = document.getElementById("sel1").value;
        var sel2 = document.getElementById("sel2").value;
        var req = {
          method: 'post', 
          url: 'findTournament',
          headers: {
            'Content-type': 'application/json'
          }, 
          data: {place: 'test'} 
        };
        $http(req).then(function(response){
      });
      });

我有按钮id="search1"，我想角执行只有当我点击这个按钮，没有自动当页面重新加载，是可能的吗?谢谢你的回答

Answer 1

HTML:

<div ng-app="myApp" ng-controller="customersCtrl as customers">
  <input data-ng-model="customers.place">
  <input data-ng-model="customers.sel1">
  <input data-ng-model="customers.sel2">
  <button data-ng-click="customers.init()"></button>
</div>

JS:

angular.module('myApp', []);
angular
   .module('myApp')
   .controller('customersCtrl', function($scope, customersService){
      var vm = this;
      vm.init = function(){
        customersService.findTournament({place: vm.place, sel1: vm.sel1, sel2: vm.sel2})
           .then(function(res){});
      };
    });
angular
   .module('myApp')
   .service('customersService', function($http){
      return {
         findTournament: findTournament
      };
      function findTournament(data){
         return $http.post('findTournament', data);
      }
   });