可能是新手问题。
我有一个问题,HTML 中的数据绑定(bind)更新得很好,但 log_interval 函数始终控制台日志“3”。我想使用更新的模型“间隔”以不同的间隔向时间序列数据库发送请求。但每次我只发送 3 个,即使我的 View 按其应有的方式更新。
我尝试过使用 $scope.$watch (如代码片段中所示),但它仅在页面加载时触发。 我还尝试了 ng-change 和 ng-click,分别在所有单选按钮和元素中。我尝试调用 $scope.$watch,但收到一条错误消息,提示 $digest 已在运行。没有任何效果:( 如何更新 Controller 中的模型,以便可以将其用于不同的 HTTP 请求?
.controller('DashCtrl', ['$scope', '$log', function($scope, $log) {
$scope.interval = 3;
$scope.$watch("interval", function() {
$log.log($scope.interval);
}, true);
$scope.log_interval = function() {
$log.log($scope.interval);
};
}])
;
<h1>{{interval}}</h1>
<div class="btn-group btn-group-justified">
<label class="btn btn-default" ng-model="interval" btn-radio="1" uncheckable>1 day</label>
<label class="btn btn-default" ng-model="interval" btn-radio="2" uncheckable>3 days</label>
<label class="btn btn-default" ng-model="interval" btn-radio="3" uncheckable>1 week</label>
<label class="btn btn-default" ng-model="interval" btn-radio="4" uncheckable>2 weeks</label>
<label class="btn btn-default" ng-model="interval" btn-radio="5" uncheckable>1 month</label>
<label class="btn btn-default" ng-model="interval" btn-radio="6" uncheckable>3 months</label>
</div>
最佳答案
您的代码似乎工作正常。
我注意到你似乎正在使用 UI-Bootstrap,所以我 fork 了他们的 Plunkr,在他们的 documentation 中展示了如何做到这一点.
查看正在运行的 Plunkr here ,它使用您的代码。
HTML:
<h4>Radio & Uncheckable Radio</h4>
<pre>{{interval || 'null'}}</pre>
<div class="btn-group">
<label class="btn btn-default" ng-model="interval" btn-radio="1" uncheckable>1 day</label>
<label class="btn btn-default" ng-model="interval" btn-radio="2" uncheckable>3 days</label>
<label class="btn btn-default" ng-model="interval" btn-radio="3" uncheckable>1 week</label>
<label class="btn btn-default" ng-model="interval" btn-radio="4" uncheckable>2 weeks</label>
<label class="btn btn-default" ng-model="interval" btn-radio="5" uncheckable>1 month</label>
<label class="btn btn-default" ng-model="interval" btn-radio="6" uncheckable>3 months</label>
</div>
Controller :
$scope.interval = 3;
$scope.$watch("interval", function() {
console.log($scope.interval);
}, true);
需要明确的是,当您选择该按钮时,此 $scope.interval
值会自动更新。因此您不必手动更新任何内容(这是使用 Angular 的主要好处之一)。因此,每当您需要执行 HTTP 请求时,只需访问 $scope.interval
值,它将是正确的值。
换句话说:您不需要$scope.$watch
,除非每当所选按钮发生变化时您需要执行更复杂的逻辑
关于javascript - Angularjs 模型仅在 View 中更改,而不在 Controller 中更改,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29778224/