CODEWITHSUNDEEP
javascriptangularjsangular-formly
Gabriele M. Ciolino
Gabriele M. Ciolino

Reputation: 51

Custom template and ng-click Angular Formly

I have a problem with a custom template that I made using Angular Formly. The template has one input text and two buttons for decrease and increase the model value of this input. The problem is that the down button works and decrease the model correctly, but the up button doesn't increase and instead performs the same action of $scope.down(). What am I wrong?

HTML Template:

  <span class="spinner">
    <button class="button decrease" ng-click="down()"></button>
    <input type="text" ng-model="model[options.key]" name="{{options.key}}" />
    <button class="button increase" ng-click="up()"></button>
  </span>

Formly Field:

item.key = key;
item.type = "my_spinner";
item.defaultValue = item.templateOptions.placeholder;
item.controller = function($scope) {
                        $scope.down = function () {
                          $scope.model[$scope.options.key] = $scope.model[$scope.options.key] - 1;
                        };
                        $scope.up = function () {
                          $scope.model[$scope.options.key] = $scope.model[$scope.options.key] + 1;
                        }
    };
}

Update: the code in JSBin seems to work http://jsbin.com/fakunoqeti/edit?html,js,console,output so what could it be the issue? I need an angular-formly expert D:D:

Upvotes: 5

Views: 1248

Answers (1)

MattE
MattE

Reputation: 1114

why are your fields like that? that is not proper formly technique.

{
  key: 'myKey',
  type: 'my_spinner',
  defaultValue: 'to.placeholder',
  templateOptions: {
      placeholder: 'myValue'
  },
  controller: function($scope) {
     $scope.down = function () {
       $scope.model[$scope.options.key]--;
     };
     $scope.up = function () {
       $scope.model[$scope.options.key]++;
     };
  }
}

that's the first place I'd start...put it in the proper format.

Then, if that doesn't work, I'd pass in the $index property in the ng-click function: ng-click="up($index)" and then change function to $scope.up = function(index) {

Upvotes: 0

Related Questions