角度自定义输入编号不起作用

Question

我真的不明白这段代码中的问题是什么：

app.directive('counter', function() {
                return {
                    restrict: 'A',
                    scope:{},
                    template:'<div class="item-counter"><input type="text" data-ng-model="qnt"><span class="glyphicon glyphicon-chevron-up" data-ng-click="increment()"><span class="glyphicon glyphicon-chevron-down" data-ng-click="decrement()"></span><button type="button" class="btn btn-success">Aggiungi</button></div>',
                    controller: function($scope) {
                        $scope.qnt = 1;
                        $scope.increment = function() {
                            $scope.qnt++;
                        };
                        $scope.decrement = function() {
                            console.log($scope.qnt > 1);
                            if ($scope.qnt > 1) {
                                $scope.qnt--;
                            }
                            console.log($scope.qnt);
                        };
                    },
                    link: function(scope, element, attrs) {
                    }
                };
            });

递增有效递减无效。怎么了？

http://plnkr.co/edit/BdFHpnrJnG4DFjTkmuZ0?p=preview

Answer 1

增量span没有任何结束标记。因此，当执行递减代码时，递增代码也在执行，使递减无效。

template:'<div class="item-counter"><input type="text" data-ng-model="qnt"><span class="glyphicon glyphicon-chevron-up" data-ng-click="increment()"></span><span class="glyphicon glyphicon-chevron-down" data-ng-click="decrement()"></span><button type="button" class="btn btn-success">Aggiungi</button></div>',

更新了此处的plunk