点击不触发任何事件 - ng-click not firing any event

ng-click not firing any event

本文关键字：任何事件 | 更新日期: 2023-09-27

这是我的HTML部分，我试图从这里输入详细信息…

<div  ng-app="angularPHP">
<div ng-controller="mainpagecntl">
     <div id="customer" class="cuscontainer" hidden="hidden">
        <div>
            <h3 class="modal-title" >Add customer</h3>
            <i class="fa fa-times" id="clo" aria-hidden="true"></i>
        </div>
            <table>
            <tr>
                <div class="form-group" >
                <td><label id="label"  class="control-label">customer Name:</label>
                <td><input type="text" class="form-control" ng-model="customer_name"  />
                </div>
            </tr>
            <tr>
            <div class="form-group">
                <td><label id="label" class="control-label">Address:</label></td>
                <td><input type="text" class="form-control" ng-model="customer_add"/></td>
            </div>
            </tr>
            </table>
                <div class="madal-footer">
                    <button class="btn btn-primary"   ng-click="custadd()">ADD</button><br />
                </div>
        </div>
</div>
</div>

这是我的angular-js部分.

var app = angular.module('angularPHP', []);
     app.controller('mainpagecntl', function($http,$scope)
    {
        $scope.custadd= function()
          {
             data={
                     cname :$scope.customer_name,                            
                      cadd: $scope.customer_add,
                   }
                   $http.post("../pos_system/Widgets/addcust.php?add",data).success(function(data)
                   { 
                   });
                  }
        });

但是当我点击按钮什么都没有发生，我的ng-click函数没有触发。

尝试像这样在<div id="customer" class="cuscontainer" hidden="hidden">上添加ng-controller="myCtrl"

<div id="customer" class="cuscontainer" hidden="hidden" ng-controller="myCtrl">

您确定函数根本没有触发吗?它可能正在发射，但只是未能发布数据。console.直接在函数内部记录一些东西来检查，例如

var app = angular.module('angularPHP', []);
app.controller('mainpagecntl', function($http,$scope) {
    var vm = this;
    vm.custadd = function() {
      console.log('test');
      var data = { cname :$scope.customer_name, cadd: $scope.customer_add};
      $http.post("../pos_system/Widgets/addcust.php?add",data)
       .success(function(data) { 
        console.log(data);
       });
    }
}

那么你的ng-click应该是这样的

ng-click='vm.custadd()'

看看这是否有什么不同。

注意:你的ng-controller也应该像

ng-controller="mainpagecntl as vm"

这是您的代码的工作演示https://plnkr.co/edit/k7yApAavre66KFAiVlOp?p=preview，当我单击Add按钮时，它工作得很好。虽然我已经从表中删除了一些div标签，因为这是不好的做法，而且当它的指令在这些标签上使用时，Angular不会识别这些标签。

var app = angular.module('angularPHP', []);
app.controller('mainpagecntl', function($http, $scope) {
    $scope.custadd = function() {
        $scope.data = {
            cname: $scope.customer_name,
            cadd: $scope.customer_add,
        }
       // $http.post("../pos_system/Widgets/addcust.php?add", data).success(function(data) {});
    }
});