我在region
上有一只手表但是当我点击单选按钮时它没有触发。
我做错了什么或是因为单选按钮只检测角度变化一次?不管怎么说,不使用表格?
<div class="filter-column">
<div class="filter-title">Region</div>
<div class="bottom-line"></div>
<div class="overflow-container">
<div ng-repeat="choice in regions| orderBy: 'description'">
<input type="radio"
value="{{choice.name}}"
name="regionRadio"
ng-model="region">
{{choice.description}}
</div>
</div>
</div>
$scope.$watchCollection(watchRMDapisPopulate,
populateRMDfiltersView);
function watchRMDapisPopulate() {
return regionMarketDealerSrv.orgFilterData;
}
function populateRMDfiltersView(newValue, oldValue) {
if (newValue) {
$scope.regions = newValue.regions;
}
}
$scope.$watch('region', radioButtonRegion);
function radioButtonRegion(regionName) {
console.log(regionName)
if (regionName === 'All') {
regionMarketDealerSrv.populateRegions();
} else {
regionMarketDealerSrv.populateMarkets(regionName);
}
}
答案 0 :(得分:2)
使用ng-model="region"
时手表无法正确接收更改,因为您使用的是原始值。当您更改值时,您将获得新的引用。您可以使用对象的属性作为模型,使用$watch
:
var app = angular.module('app', [])
app.controller('MyController', function($scope) {
$scope.regions = [{
name: 'a',
description: 'region A'
}, {
name: 'b',
description: 'region B'
}];
$scope.selected = {
region: 'a'
};
$scope.$watch('selected.region', radioButtonRegion);
function radioButtonRegion(newVal, oldVal) {
if (newVal !== oldVal) {
console.log(newVal, oldVal)
}
}
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app" ng-controller="MyController">
<div>Region</div>
<div ng-repeat="choice in regions| orderBy: 'description'">
<input type="radio" value="{{choice.name}}" name="regionRadio" ng-model="selected.region">{{choice.description}}
</div>
</div>