Ng-model不更新控制器值

看看这个小提琴http://jsfiddle.net/ganarajpr/MSjqL/

我有(我想!)做了你一直在做的事情，看起来很有效。你能检查一下什么对你不起作用吗?

控制器作为版本(推荐)

这里是模板

<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);
}

在处理非平凡视图(存在嵌套作用域)时，我遇到了同样的问题。最后发现，在开发AngularJS应用程序时，这是一个众所周知的棘手的事情，因为基于原型的java-script继承的本质。AngularJS的嵌套作用域就是通过这种机制创建的。从ng-model创建的值被放置在子作用域中，并不是说父作用域(可能是注入到控制器中的那个)不会看到这个值，如果不使用dot强制原型引用访问，这个值也会在父作用域中定义的具有相同名称的任何属性的阴影。欲了解更多细节，请查看在线视频，具体说明此问题，http://egghead.io/video/angularjs-the-dot/和后续评论。

在《用AngularJS掌握Web应用程序开发》一书第19页中写道

避免直接绑定作用域的属性。双向数据绑定到 对象的属性(在作用域上公开)是首选方法。作为一个 方法提供的表达式中应该有一个点 Ng-model指令(例如，Ng-model ="thing.name").

作用域只是JavaScript对象，它们模仿dom层次结构。根据JavaScript原型继承，作用域属性是通过作用域分隔的。为了避免这种情况，点符号应该用来绑定ng-models。

我只是在使用绑定到body元素的root_controller时遇到了这个问题。然后我在angular路由器中使用ng-view。问题是，当angular将html插入ng-view元素时，总是会创建一个新的作用域。因此，我的“check”函数是在ng-model元素修改的作用域的父作用域中定义的。

要解决这个问题，只需在路由加载的html内容中使用专用控制器。

"如果你使用ng-model，你必须在那里有一个点。
让你的模型指向一个对象。

控制器

$scope.formData = {};
$scope.check = function () {
console.log($scope.formData.searchText.$modelValue); //works
}

模板

<input ng-model="formData.searchText"/>
<button ng-click="check()">Check!</button>

当子作用域在play - like子路由或ng-repeat中发生。 子作用域创建自己的值，并产生名称冲突如图所示:
https://www.youtube.com/watch?v=SBwoFkRjZvE&t=3m15s

使用this代替$scope有效。

function AppCtrl($scope){
$scope.searchText = "";
$scope.check = function () {
console.log("You typed '" + this.searchText + "'"); // used 'this' instead of $scope
}
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>


<div ng-app>
<div ng-controller="AppCtrl">
<input ng-model="searchText"/>
<button ng-click="check()">Write console log</button>
</div>
</div>

在写这个答案的时候，我的情况比这复杂得多。评论结束后，我试图重现它，以理解它为什么有效，但运气不好。我认为以某种方式(不知道为什么)生成了一个新的子作用域，并且this指向该作用域。但如果使用$scope，它实际上是指父对象$作用域，因为javascript的词法作用域特性。

如果有人有这个问题，以这种方式测试并通知我们，那就太好了。

你可以这样做，以便在ng-keypress enter中搜索输入文本，在ng-click中搜索图标:

<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);
}
}

我也遇到了同样的问题，这是由于我没有在控制器顶部首先声明空白对象:

$scope.model = {}


<input ng-model="model.firstProperty">

希望这对你有用!

对我来说，这个问题是通过将我的数据存储到一个对象(这里是“数据”)来解决的。

NgApp.controller('MyController', function($scope) {


$scope.my_title = ""; // This don't work in ng-click function called


$scope.datas = {
'my_title' : "",
};


$scope.doAction = function() {
console.log($scope.my_title); // bad value
console.log($scope.datas.my_title); // Good Value binded by'ng-model'
}
   



});

我希望它会有帮助

由于没有人提到这个问题，可以通过向bound属性添加$parent来解决

<div ng-controller="LoginController">
<input type="text" name="login" class="form-control" ng-model="$parent.ssn" ng-pattern="/\d{6,8}-\d{4}|\d{10,12}/" ng-required="true" />
<button class="button-big" type="submit" ng-click="BankLogin()" ng-disabled="!bankidForm.login.$valid">Logga in</button>
</div>

还有控制器

app.controller("LoginController", ['$scope', function ($scope) {
$scope.ssn = '';


$scope.BankLogin = function () {
console.log($scope.ssn); // works!
};
}]);

我也有同样的问题 正确的方法是将'searchText'设置为对象内部的属性。< / p > 但是如果我想让它保持原样，一个字符串呢?好吧，我尝试了这里提到的每一种方法，都没用 但随后我注意到问题只在初始化中，所以我刚刚设置了value属性，它工作了

<input type="text" ng-model="searchText" value=\{\{searchText}} />

这样，值就被设置为'$scope。searchText的值，当输入值改变时，它会被更新。

我知道这是个变通办法，但对我很管用。

我也面临同样的问题… 对我来说有效的解决方法是使用关键字..........

警报(this.ModelName);