Javascript 输入中的Angularjs ng模型不更新控制器中的值
有人能解释一下为什么当我打印Javascript 输入中的Angularjs ng模型不更新控制器中的值,javascript,angularjs,input,angularjs-ng-model,Javascript,Angularjs,Input,Angularjs Ng Model,有人能解释一下为什么当我打印console.log($scope.inputvalue)时,变量没有用我在输入中输入的值更新吗 也许我只是误解了ng model的含义,在这种情况下,如何将值从视图传递给控制器 (函数(){ "严格使用",; 角度。模块('午餐支票',[]) .controller('checkiftoomoty',['$scope',checkiftoomoty]); 函数checkiftoomoty($scope){ $scope.inputvalue=“”; log($s
console.log($scope.inputvalue)
时,变量没有用我在输入中输入的值更新吗
也许我只是误解了ng model
的含义,在这种情况下,如何将值从视图传递给控制器
(函数(){
"严格使用",;
角度。模块('午餐支票',[])
.controller('checkiftoomoty',['$scope',checkiftoomoty]);
函数checkiftoomoty($scope){
$scope.inputvalue=“”;
log($scope.inputvalue);
}
})();代码>
午餐收银员
.message{font size:1.3em;font-weight:bold;}
午餐收银员
检查是否太多
磁盘总数:{{inputvalue}
您正在设置$scope.inputvalue=“”在控制台.log
之前的code>。但在更改值后,需要再次console.log
。
尝试使用:
function checkiftoomuch($scope){
$scope.inputvalue = "";
console.log($scope.inputvalue);
$scope.$watch('inputvalue', function(newValue, oldValue){
console.log(newValue);
})
}
或者在按钮上添加一个功能,如:
<div class="form-group">
<button class="btn btn-default" ng-click="showValue()>Check If Too Much</button>
</div>
AngularJS具有双向数据绑定,这意味着视图和控制器中的值总是同步的,它们不必来回传递。“每当你有ng模型时,其中的某个地方一定有一个点。如果你没有点,你就做错了。”。您的问题是,您正在编辑的inputValue位于子直接作用域内,而不是控制器的。您必须将您的输入放入像$scope.state={inputValue:0}
这样的对象中,并使用ng model=“state.inputValue”
@pierreemanuellallemant-我希望在这里有所不同,您可以始终使用直接附加到作用域的变量,而不将其作为对象属性。inputValue
肯定在控制器的作用域内。@AnuragSrivastava不,你不能。最好的方法是使用控制器:在指令声明中使用'controllerAs':“$ctrl'
,并在控制器中使用this.inputValue
,而不是$scope.inputValue
,在视图中使用ng model=“$ctrl.inputValue”
。它不在$scope中,只是附加到控制器的this
。@pierreemanuellallemant您运行了上面提供的代码段吗?视图在不使用任何对象或controllerAs
语法的情况下更新。没有阅读您的代码,似乎您遇到了另一个问题。但是无论如何,如果您在输入周围使用指令(ng if等),您的ngmodel=“inputvalue”
将成为一个问题,因为将有一个新的作用域,在这种情况下,控制器中的$scope.inputvalue将不会返回显示的值。非常感谢。我仍在努力理解视图和控制器之间的同步概念。我认为控制器中的变量会在视图中的更改后自动更新。因此,我想我没有正确理解ng-model的功能。该变量确实在控制器中进行了更新,您也可以通过{{inputValue}}
在视图中看到。这只是在值更改后将值放入控制台的问题。
function checkiftoomuch($scope){
$scope.inputvalue = "";
console.log($scope.inputvalue);
$scope.showValue = function(){
console.log($scope.inputvalue);
}
}