双向数据绑定对我不起作用

时间:2017-09-20 10:52:03

标签: html angularjs laravel-5

在html文件中,输入字段的值已更新。并使用$ scope,我第一次能够分配输入字段。但是当我在htlm中更改输入字段时,输入字段值已更改但在js中,控制台日志值未更改。我想在js函数中获取更新的值。我正在使用laravel框架。在实践中它可以工作。但我的项目不起作用。谢谢。

的index.html

<div class="form-group">
<div class="col-sm-12">
    <input type="text" class="form-control"
           id="send_amount"
           name="send_amount"
           ng-model="send_amount"
           ng-keyup="calculateReceivedAmount()" required>
</div>
@{{ send_amount }}

我的js文件

var exchange = angular.module('app', []);
exchange.controller('MoneyExchangeController', MoneyExchangeController);
function MoneyExchangeController($scope, $http) {
    $scope.send_amount = 100;
    $scope.calculateReceivedAmount = function () {
        console.log($scope.send_amount);
    }
}

1 个答案:

答案 0 :(得分:2)

AngularJS在绑定非对象变量方面存在问题,请尝试按如下方式绑定输入:

的index.html

<input type="text"
       class="form-control"
       id="send_amount"
       name="send_amount"
       ng-model="send_amount.value"
       ng-keyup="calculateReceivedAmount()"
       required />

app.js

var exchange = angular.module('app', []);
exchange.controller('MoneyExchangeController', MoneyExchangeController);
function MoneyExchangeController($scope, $http) {
    $scope.send_amount = {
        value: 100
    };
    $scope.calculateReceivedAmount = function () {
        console.log($scope.send_amount.value);
    };
}