ng-click控制器中不触发功能

Question

The bug is very weird, I have been stucking here for hours just can find why my function in controller is fired.

Here is my HTML code:

<div class="col-md-9 clearfix" id="customer-account" ng-controller='ProfileController'>
  <div class="box clearfix">
    <div class="row">
      <div class="col-sm-6">
        <div class="form-group">
          <label for="password_old">oldpassword</label>
          <input type="password" class="form-control" id="password_old" ng-model="passwordold">
        </div>
      </div>
    </div>
    <div class="row">
      <div class="col-sm-6">
        <div class="form-group">
          <label for="password_1">newpassword</label>
          <input type="password" class="form-control" id="password_1" ng-model="passwordnew1">
        </div>
      </div>
      <div class="col-sm-6">
        <div class="form-group">
          <label for="password_2">retype</label>
          <input type="password" class="form-control" id="password_2"ng-model="passwordnew2">
        </div>
      </div>
      <p>{{passwordnew2}}</p>
    </div>
    <!-- /.row -->

    <div class="text-center">
      <button type="submit" class="btn btn-primary">
        <i class="fa fa-save" ng-click="changePwd(passwordold,passwordnew1,passwordnew2)"></i> save
      </button>
    </div>
    <div class="text-center" >
      <p>{{errorMessageChangepwd}}aaaa</p>
    </div>
  </div>
</div>

After I click the Button, which ng-click attribute as you can see, nothing happen.

Here is my controller code:

controller('ProfileController', ['$scope','UserFactory','SharedDataFactory',
        function($scope,UserFactory,SharedDataFactory){
                $scope.user = UserFactory.user;
                $scope.passwordold;
                $scope.errorMessageChangepwd='error';
                $scope.showErrMsgChangepwd = false;
                $scope.passwordnew1;
                $scope.passwordnew2;
                $scope.changePwd = function(passwordold,passwordnew1,passwordnew2){
                       console.log("aaaaaaaaaa");
                       if (passwordnew1!==passwordnew2){
                          $scope.showErrMsgChangepwd= true;
                          $scope.errorMessageChangepwd = 'error';
                        }else{
                          UserFactory.changePwd(passwordnew1)
                          .catch(function(err){
                                 console.log(err.data);
                          }).then(function(response){
                              console.log(response);
                          });
                        }
                };}]);

I called console.log("aaaaaaaaaa"); in the first line of my function, but after I click the button, nothing is shown on console. And also

<div class="text-center" >
 <p>{{errorMessageChangepwd}}aaaa</p>
</div>`

does not show error aaaa as expected but aaa on the browser. what could be wrong?

Thanks.

Answer 1

You need to add ng-controller="ProfileController" in the top of your form. Which looks like missing on your code.