javascript AngularJs - forEach 范围数组 - 不工作
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/16154681/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
AngularJs - forEach scope array - not working
提问by Bye
I recognize I am doing something stupid, so please indulge me:
我知道我在做一些愚蠢的事情，所以请放纵我：
Html:
网址：
Filter: <input type="radio" ng-model="Type" value="Rear"> Rear
<input type="radio" ng-model="Type" value="Front"> Front
<br>
Select:
<name-value-select entry="entry" field="axleType" options="filterTypes"></name-value-select>
Controller:
控制器：
$scope.$watch('Type', function (Type) {
$scope.filterTypes = [];
if ($scope.axleTypes == undefined || $scope.axleTypes == []) {
$scope.axleTypes = API.GetAxleTypes;
}
angular.forEach($scope.axleTypes, function (type) {
console.log('axleType: ' + type);
console.log('Type: ' + type);
if (axleType.Type == Type) {
this.push(axleType);
}
}, $scope.filterTypes);
$scope.filterTypes.sort(function (a, b) {
return a.Description.localeCompare(b.Description);
});
});
I cannot even loop thru the axleTypes array in my watch function. It appears it is not picking up a collection which is odd because it bypasses populating the axleTypes if undefined or [].
我什至无法在我的 watch 函数中循环遍历 axisTypes 数组。看起来它没有选择一个奇怪的集合，因为如果未定义或 []，它会绕过填充轴类型。
I am doing something so stupid, I can't see it.
我正在做一些如此愚蠢的事情，我看不到它。
Update: Per Jason's request
更新：根据杰森的要求
(1) My angular controller:
(1) 我的角度控制器：
$scope.entry = {
Description: ''
};
$scope.Type = 'Front';
$scope.entry.type = '';
$scope.$watch('Type', function (Type) {
$scope.filterTypes = [];
$scope.axleTypes = new API.GetAxleTypes(function (axleTypes) {
angular.forEach($scope.axleTypes, function (axleType) {
if (axleType.Type == Type) {
this.push(axleType);
}
}, $scope.filterTypes);
});
$scope.filterTypes.sort(function (a, b) {
return a.Description.localeCompare(b.Description);
});
});
(2)My Html:
(2)我的HTML：
Filter: <input type="radio" ng-model="Type" value="Rear"> Rear
<input type="radio" ng-model="Type" value="Front"> Front
<br>
Select:
<name-value-select entry="entry" field="axleType" options="filterTypes"></name-value-select>
No more errors Jason, however, when I toggle the two radio buttons nothing happens, ie, Front Axles still show when I choose the Rear axle radio button. Ughh.
没有更多错误 Jason 然而，当我切换两个单选按钮时什么也没有发生，即，当我选择后轴单选按钮时，前轴仍然显示。呃。
回答by Jason Aden
Okay, cool. I think this is what you want to do. Basically you are loading up your data first, then setting the watch. This way we don't call the async call too many times. I modified the Plunker to use this methodology http://plnkr.co/edit/lQbn4hXmJ1Z4YpKdb4u3?p=preview:
好的，很酷。我认为这就是你想要做的。基本上，您首先加载数据，然后设置手表。这样我们就不会多次调用异步调用。我修改了 Plunker 以使用这种方法http://plnkr.co/edit/lQbn4hXmJ1Z4YpKdb4u3?p=preview：
$scope.axleTypes = API.GetAxleTypes(function () {
$scope.$watch('Type', function (Type) {
$scope.filterTypes = [];
angular.forEach($scope.axleTypes, function (type) {
console.log('axleType: ' + type);
console.log('Type: ' + type);
if (axleType.Type == Type) {
this.push(axleType);
}
if(!$scope.$$phase) $scope.$digest();
}, $scope.filterTypes);
});
});
$scope.filterTypes.sort(function (a, b) {
return a.Description.localeCompare(b.Description);
});
