两个 ng 单击函数不会一起执行

Two ng-click function not executing together

本文关键字:一起 执行 函数 ng 单击 两个      更新时间:2023-09-26

我想在一次ng单击中执行两个函数,但它没有执行。

当我尝试单独执行它们时,它工作正常。

我用分号 ' 分隔两个函数名称;'.

这是我的代码:

<!DOCTYPE html>
<html>
<body ng-app="starter" ng-controller="NavCtrl">
<ion-pane>
  <ion-header-bar class="bar-stable">
    <h1 class="title">Ionic head</h1>
  </ion-header-bar>
  <ion-content>
    <h4>Enter the details</h4>
    <div class="list list-inset" >
      <label class="item item-input">
        <input type="text" name="place" ng-model="data.place" value="" placeholder="Place">
      </label>
      <label class="item item-input">
        <input type="number" name="pincode" ng-model="data.pincode" value="" placeholder="Pin Code">
      </label>
      <button class="button button-block button-positive" ng-click="savedata(); navigat('/success.html')" >
        Submit
      </button>
    </div>
  </ion-content>
</ion-pane>
</body>
</html>

这是控制器代码:

app.controller('NavCtrl',function($scope,$location,$http,$window){
  $scope.data = {};
  $scope.savedata = function(){
    $http.post("http://localhost/angular/insert2.php",{'place':$scope.data.place,'pincode':$scope.data.pincode})
      .success(function(data,status,headers,config){
    //console.log(data);
        alert("successful");
      })
      .error(function(){
        alert("failed");
      })
  };
  $scope.navigat = function(url){
    $window.location.href=url;
  };
  $scope.submit = function(){
    $scope.savedata();
  //$scope.navigat('/success.html');
 // $window.location.href='/success.html';
  }
});

我还尝试调用提交函数,该函数调用其他两个函数 - savedata(( 和 navigat((- 但它只调用一个函数。

我还尝试将这两个函数放在两个不同的控制器中 - 然后在 body 元素上调用一个控制器,在按钮元素之前调用另一个在div 元素上调用另一个控制器。但看起来它甚至没有加载一个控制器。

请帮忙

你能试试这个吗:

   app.controller('NavCtrl',function($scope,$location,$http,$window){
  $scope.data = {};
  $scope.savedata = function(){
    $http.post("http://localhost/angular/insert2.php",{'place':$scope.data.place,'pincode':$scope.data.pincode})
      .success(function(data,status,headers,config){
    //console.log(data);
        alert("successful");
        $scope.navigat('/success.html');
      })
      .error(function(){
        alert("failed");
      })
  };
  $scope.navigat = function(url){
    $window.location.href=url;
  };
  $scope.submit = function(){
    $scope.savedata();
  //$scope.navigat('/success.html');
 // $window.location.href='/success.html';
  }
});

您可以将 navigat('/success.html'( 放在 savedata 中发布调用的成功回调中

你应该在savedata成功内部调用导航。

因为当您的savedata被调用并等待 ajax 响应时,navigate 正在被调用并导航到新页面。

按如下方式使用回拨

$scope.savedata = function(callback){
    $http.post("http://localhost/angular/insert2.php",{'place':$scope.data.place,'pincode':$scope.data.pincode})
      .success(function(data,status,headers,config){
        alert("successful");
        if(callback) callback($scope);
      })
      .error(function(){
        alert("failed");
      })
  };

调用如下

<button class="button button-block button-positive" ng-click="savedata(function (s) {s.navigat('/success.html')} );" >
        Submit
      </button>

http://plnkr.co/edit/QF80s7YxsLor70cNxLRk