可能是愚蠢的问题，但我有我的html表单简单的输入和按钮:
<input type="text" ng-model="searchText" />
<button ng-click="check()">Check!</button>
{{ searchText }}
然后在控制器中(模板和控制器由routeProvider调用):
$scope.check = function () {
console.log($scope.searchText);
}
为什么我看到视图更新正确，但在控制台未定义时，单击按钮?
谢谢!
更新: 似乎我已经解决了这个问题(之前不得不提出一些变通办法): 只需要把我的属性名从searchText改为search。文本，然后定义空$scope。搜索= {};对象，瞧……但我不知道为什么它能起作用;]
当前回答
你可以这样做，在ng键下搜索输入文本，在ng键下点击图标:
<input type="text" ng-model="searchText" ng-keypress="keyEnter(this,$event)" />
<button ng-click="check(searchText)">Check!</button>
in the controller
$scope.search = function (searchText) {
console.log(searchText);
}
$scope.keyEnter = function (serachText,$event) {
var keyCode = $event.which || $event.keyCode;
if (keyCode === 13) {//KeyCode for Enter key
console.log(searchText);
}
}
其他回答
看看这小提琴http://jsfiddle.net/ganarajpr/MSjqL/
我有(我想!)做了你一直在做的事情，看起来很有效。你能检查一下什么对你不起作用吗?
使用this代替$scope也可以。 函数AppCtrl(美元范围){ 美元的范围。searchText = ""; 美元的范围。Check = function () { console.log(“你输入了”+这个。searchText + "'");//使用'this'而不是$scope ｝ ｝ < script src = " https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js " > < /脚本> < div ng-app > < div ng-controller = " AppCtrl " > <输入ng-model = " searchText " / > <按钮ng-click = "检查()">写入控制台日志</按钮> . < / div > < / div >
编辑:在写这个答案的时候，我的情况比这复杂得多。评论结束后，我试图重现它，以理解它为什么有效，但运气不好。我认为以某种方式(不知道为什么)生成了一个新的子范围，这是指那个范围。但如果使用$scope，它实际上引用的是父$scope，因为javascript的词法范围特性。
如果有人有这个问题，以这种方式测试并通知我们，那就太好了。
为表单控件提供name属性
控制器为版本(推荐)
这里是模板
<div ng-app="example" ng-controller="myController as $ctrl">
<input type="text" ng-model="$ctrl.searchText" />
<button ng-click="$ctrl.check()">Check!</button>
{{ $ctrl.searchText }}
</div>
JS的
angular.module('example', [])
.controller('myController', function() {
var vm = this;
vm.check = function () {
console.log(vm.searchText);
};
});
示例:http://codepen.io/Damax/pen/rjawoO
最好是在Angular 2中使用component。x或Angular 1.5或更高版本
########旧方式(不推荐)
不建议这样做，因为字符串是原语，强烈建议使用对象
在标记中试试这个
<input type="text" ng-model="searchText" />
<button ng-click="check(searchText)">Check!</button>
{{ searchText }}
这是你的控制器
$scope.check = function (searchText) {
console.log(searchText);
}
I came across the same issue when dealing with a non-trivial view (there are nested scopes). And finally discovered this is a known tricky thing when developing AngularJS application due to the nature of prototype-based inheritance of java-script. AngularJS nested scopes are created through this mechanism. And value created from ng-model is placed in children scope, not saying parent scope (maybe the one injected into controller) won't see the value, the value will also shadow any property with same name defined in parent scope if not use dot to enforce a prototype reference access. For more details, checkout the online video specific to illustrate this issue, http://egghead.io/video/angularjs-the-dot/ and comments following up it.
