Ng-Click doesn't work inside Ng-If

Question

Edit: I discovered my Ng-click wasn't working inside my Ng-if. What do I do to fix this?

Original post:

After scouring other answers I'm mystified as to why this is not working. It was working on a prior commit, but I cannot get why my ngclick doesn't even activate. I had console print comment in the ngclick function. I don't even have a 500 error or anything which means that the addItem() doesn't activate...

View

<form class="row container center" name="itemForm" ng-submit="addItem()">

  <div class="center ">
        <br>
            <input ng-model="item.title" name="title" type="text" class="form-control validate" placeholder="Item Name">
        <br>
            <input ng-model="item.city" name="city" type="text" class="form-control validate" placeholder="Amount">
            <input ng-model="item.state" name="state" type="text" class="form-control validate" placeholder="Amount">

          <a class="waves-effect waves-light btn center white-text" ng-click="addItem()" type="submit" ng-submit="addItem()">Add Item</a>
    </div>

</form>

Controller

The gets work for other things. addItem takes the stuff from the form above, then also uses userId because the model below is associated with userId.

angular.module("mvpApp")
.controller('dashboardCtrl', ['$scope', '$http', '$location', function($scope, $http, $location) {

  $scope.init = function() {
    setTimeout(function() {
      $scope.checkAuthentication();
      $scope.getUserItems();
      $scope.getItems();
    },100);
  }

  $scope.getUserItems = function() {
    $http.get('/api/items?UserId=' + $scope.user.id)
    .then(function(result) {
      $scope.userItems = result.data;
      for(var i = 0; i < $scope.userItems.length; i++) {
        $scope.userItems[i].newActivity = {};
      }
    }, function(err) {
      console.log(err)
    });
  };

  $scope.addItem = function(){
    $http.post("/api/items", {
      title: $scope.item.title,
      city: $scope.item.city,
      state: $scope.item.state,
      UserId: $scope.user.id
    })
    .then(function (result) {
      $scope.userItems.push(result.data);
      $scope.item.title = "";
      $scope.item.city = "";
      $scope.item.state = "";
     },function(err) {
      console.log(err)
    });
  };

}]);

Model

module.exports = function(sequelize, DataTypes) {
  var Item = sequelize.define('Item', {
    title: {
      type: DataTypes.STRING,
      allowNull: false,
      validate: {
        notEmpty: true
      }
    },
    city: {
      type: DataTypes.STRING,
      allowNull: false,
      validate: {
        notEmpty: true
      }
    },
    state: {
      type: DataTypes.STRING
    }

  }, {
    classMethods: {
      associate: function(models) {
        Item.belongsTo(models.User)
      }
    }
  });

  return Item;
}

Please try removing the `ng-click="addItem()"` and the `ng-submit="addItem()"` from your a-tag. Then try turning your anchor tag into a button: `` — Oliver, Jul 26 '16 at 16:39
Mh, could you create a jsfiddle so I can take a deeper look into the problem? — Oliver, Jul 26 '16 at 18:48
So I actually found out the issue. ng-click doesn't work in my ng-if tags the I had it under — Natu Myers, Jul 26 '16 at 19:53
Possible duplicate of [AngularJS: ng-if not working in combination with ng-click?](http://stackoverflow.com/questions/19812116/angularjs-ng-if-not-working-in-combination-with-ng-click) — Motin, Feb 16 '17 at 09:29

Ng-Click doesn't work inside Ng-If

0 Answers0