javascript - ng-model 不与文本字段绑定(bind)

标签 javascript angularjs scope

考虑以下 JS

angular.module('myApp')
    .controller('HeaderCtrl', function($scope) {
        $scope.searchBooking = "test";

        $scope.goToBooking = function() {
            console.log($scope.searchBooking);
            //$location.path('/bookings/' + $scope.searchBooking);
            //delete($scope.searchBooking);
        }

        $scope.printValue = function() {
            console.log($scope.searchBooking);
        }
    }
);

以及以下 HTML

<div class="input-group custom-search-form">
    <input type="text" class="form-control" placeholder="Testing" ng-model="searchBooking" ng-change="printValue()">
    <span class="input-group-btn">
        <button class="btn btn-default" type="button">
            <i class="fa fa-search"></i>
        </button>
    </span>
</div>

我的问题是,当页面加载时,“测试”被写入文本字段,但是当我更改字段或按下按钮时,没有任何反应(每次更改或单击按钮时控制台都会显示“测试”。任何人都知道我做错了什么?

最佳答案

尝试将值包装在对象中。对象通过引用传递,但简单值作为该值的副本传递。我也遇到过好几次了。

尝试这个方法

$scope.myObject.searchBooking = "test"

所以完整的代码将如下所示

angular.module('myApp')
.controller('HeaderCtrl', function($scope) {
    $scope.myObject.searchBooking = "test";

    $scope.goToBooking = function() {
        console.log($scope.myObject.searchBooking);
        //$location.path('/bookings/' + $scope.myObject.searchBooking);
        //delete($scope.myObject.searchBooking);
    }

    $scope.printValue = function() {
        console.log($scope.myObject.searchBooking);
    }
}
);

和 html

<input type="text" class="form-control" placeholder="Testing" ng-model="myObject.searchBooking" ng-change="printValue()">

关于javascript - ng-model 不与文本字段绑定(bind),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37807743/

相关文章:

ruby-on-rails - 如何检查范围 rails 中是否存在参数

java - 带有自定义对象数组列表的 Java 中的变量范围问题

javascript - 变量提升在这个 JS 示例 : if(true){. ..} 中是如何工作的

javascript - 为什么我的 angularJS 在我的示例网站上不起作用?

javascript - 表格内的全屏视频背景(水平布局)

javascript - d3js 中数据跳跃是如何发生的

javascript - 在另一个元素之后查找具有特定类/标签名称的第一个元素

html - 如何使用动态数据创建 AngularJS 图表

html - 如何显示 ng-repeat 水平?

angularjs - 具有过滤属性的 ng-repeat 过滤器