用輸入欄和添加/減號按鈕調整輸出AngularJS

Question

這是我第一次使用angularjs 我試圖做一個示例代碼，其中用戶可以在該字段上放置一個數字，或者他可以使用該按鈕來增加/減少數量，但不低於0

<div data-ng-app='CountApp' data-ng-controller='CountCtrl'> 
    <div class="outside-border"> 
    <input id="output_test" type="text" ng-model="count" style="width: 150px;"> 
    <div class="minus"> 
     <button class="button" id="test_sample" data-ng-click='count = count - 1'>-</button> 
    </div> 
    <div class="add"> 
     <button class="button" data-ng-click='count = count + 1'>+</button> 
    </div> 
    </div> 
</div> 



var app = angular.module('CountApp', []); 

app.controller('CountCtrl', function($scope) { 
    $scope.count = 1; 
}); 

目前正在發生的事情是，每當有在球場上和用戶點擊+按鍵沒有數，輸出爲1111111 或者如果用戶輸入的數字（例如35）輸出變成3511111 有人可以解釋或幫助我這方面。

這是我迄今所做https://jsfiddle.net/wbuh2hrd/

Answer 1

使用三元操作驗證計數小於0或者不喜歡這個

<button class="button" id="test_sample" data-ng-click='count = (count <= 0) ? 0 : count-1' >-</button> 

，並添加功能，加號按鈕和投字符串爲int

<button class="button" data-ng-click='plusCount()'>+</button> 
$scope.plusCount = function(){ 
    $scope.count = parseInt($scope.count) + 1; 
} 

Demo

Answer 2

有很多方法來解決這個問題，其中之一是改變你的輸入類型type="number"

如果你不喜歡出現，當按鈕你在某些瀏覽器上的鼠標懸停，你可以使用css隱藏它（http://www.thatstevensguy.com/programming/disable-arrows-on-number-inputs/）

編輯：您可以使用min=0來控制數字類型輸入中的最小值。