`ng-click`在`ng-repeat`中没有工作

时间:2015-02-09 06:43:33

标签: javascript angularjs angularjs-ng-repeat angularjs-ng-click

我正在尝试显示一个多个按钮,该按钮触发相同的功能但参数不同,但它的ng-click功能不起作用。

以下是我的观点:

<div class="row" ng-repeat="editPhone in studentDetail ">

            <table class="table table-striped m-b-none">
              <tbody>
              <tr>
                  <td>Signup Number</td>
                  <td><input type="text" ng-model="editPhone.phone_no"></td>
                  <td> 
                      <button class="btn btn-sm btn-success btn-addon" ng-click="testJs(editPhone.studentid,'signup',editPhone.phone_no)">
                        <i class="fa fa-save"></i>Save 
                      </button>
                      <i id="signup" class="fa fa-spin fa-spinner hide"></i>
                  </td>
                </tr>
                <tr>
                  <td>Permanent</td>
                  <td><input type="text" ng-model="editPhone.per_tel"></td>
                  <td> 
                      <button class="btn btn-sm btn-success btn-addon" ng-click="saveContactNumbers(editPhone.studentid,'permanent',editPhone.per_tel)">
                          <i class="fa fa-save"></i>Save
                      </button>
                      <i id="permanent" class="fa fa-spin fa-spinner hide"></i>
                  </td>

                </tr>
                <tr>
                  <td>Communication</td>
                  <td><input type="text" ng-model="editPhone.comm_mobileno"></td>
                    <td> 
                      <button class="btn btn-sm  btn-success btn-addon" ng-click="saveContactNumbers(editPhone.studentid,'communication',editPhone.comm_mobileno)">
                         <i class="fa fa-save"></i>Save
                      </button>
                        <i id="communication" class="fa fa-spin fa-spinner hide"></i>
                  </td>

                </tr>
              <tr>
                  <td>Prefered</td>
                  <td><input type="text" ng-model="editPhone.phone_preffered"></td>
                  <td> 

                      <button class="btn btn-sm  btn-success btn-addon" ng-click="saveContactNumbers(editPhone.studentid,'preferred',editPhone.phone_preffered)">
                        <i class="fa fa-save"></i>Save
                      </button>
                        <i id="preferred" class="fa fa-spin fa-spinner hide"></i>
                  </td>

                </tr>

              </tbody>
            </table>


          </div>

我与studentDetail绑定的所有数据都正确显示。这意味着Angular运行良好。

为什么ng-click没有触发函数?

这是我的功能:

$scope.saveContactNumbers=function(studentid,typeChange,updatedNumber){
    console.log('saveContactNumbers');
}

This是我的完整HTML和JS控制器代码

改性:: 在我的整个代码中,我无法在ng-click上触发任何控制器的功能。

解决方案::完全是我的错误。我错误地认为,在其他功能结束之前我已经确定了我的功能。

2 个答案:

答案 0 :(得分:0)

ng-repeat创建了一个新范围。您必须以不同方式引用您的保存方法:

 <body ng-controller="MyPageCtrl as pageCtrl">
   <div class="row" ng-repeat="editPhone in studentDetail ">
      <button class="btn btn-sm btn-success btn-addon" ng-click="pageCtrl.saveContactNumbers(editPhone.studentid,'permanent',editPhone.per_tel)"></button>
   <div>
</body>

控制器:

   (function () {
    'use strict';

    angular
        .module('app')
        .controller('MyPageCtrl', MyPageCtrl);

    MyPageCtrl.$inject = ['$window'];

    function MyPageCtrl($window) {
        /* jshint validthis:true */
        var vm = this;

        vm.saveContactNumbers = function (studentId, type, telephone) {
        //save student details
        }
    }
})();

答案 1 :(得分:0)

请将参数作为字符串传递

<button class="btn btn-sm btn-success btn-addon" ng-click="saveContactNumbers('editPhone.studentid','permanent','editPhone.per_tel')">
相关问题