使用AngularJS从输入中获取新值

Get the new value from an input with AngularJS

本文关键字:获取 新值 输入 AngularJS 使用      更新时间:2023-09-26

我正在尝试将JQuery网站转换为AngularJS,但我不能弄清楚这个

$('.bet').change(function(e)  {
    // Do someting
};

我试着用AngularJS做很多事情,但没有成功。
现在我的HTML中有这个而Angular文件中没有相关的

index . php

<input type="number" class="form-control" id="bet" name="bet" placeholder="Your bet" ng-model="bet" ng-change="bet( {{bet}} )"/>

如何在AngularJS中做到这一点?

来自文档:

当用户改变输入时计算给定表达式。表达式立即求值,不像JavaScript的onchange事件只在更改结束时触发(通常,当用户离开表单元素或按下返回键时)。

基本上你需要绑定一个函数到一个ng-change属性,像这样:

<input type="number" name="bet" placeholder="Your bet" ng-model="bet" ng-change="betChanged(bet)"/>

和控制器中的监听器:

$scope.betChanged = function(bet){
   //do something...
   console.log(bet);
}

像这样,betChanged将在每次bet发生变化时被调用,很像javascript的原生input函数。

var myApp = angular.module('myApp',[]);
myApp.controller('myCtrl', ['$scope', function($scope) {
  $scope.bet = "";
  $scope.onBetChanged = function () {
    alert($scope.bet);
  };
}]);
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp" ng-controller="myCtrl">
<input type="number" class="form-control" id="bet" name="bet" placeholder="Your bet" ng-model="bet" ng-change="onBetChanged()"/>
</div>

美元看

<div ng-app="myApp" ng-controller="myCtrl">
        First Name:
        <input type="text" ng-model="firstName"><br>
        Full Name: {{firstName }}
    </div>
    <script>
        var app = angular.module('myApp', []);
        app.controller('myCtrl', function ($scope, $window) {
            $scope.$watch('firstName', function (newValue, oldValue) {
                console.log('oldValue=' + oldValue);
                console.log('newValue=' + newValue);
                //do something
                $window.alert("Event fired");
            });
        });
    </script>