0
我已經嘗試了很多這個問題的答案,但沒有任何工作。
的錯誤:眼下當加總的數據項符合要求的項目,該項目從列表中刪除,但名單沒有刷新與在選擇下拉菜單或子列表中刪除該項目的視圖。
我認爲有一些具體的事情我的代碼,所以我在這裏重建我的功能:
var app = angular.module('plunker', []);
app.controller('MainCtrl', function($scope, filterFilter) {
Array.prototype.sum = function(prop) {
var ptotal = 0
for (var i = 0, _len = this.length; i < _len; i++) {
ptotal += this[i][prop]
}
return ptotal
}
$scope.owners = [{
"id": "1",
"name": "parent 1"
}, {
"id": "2",
"name": "parent 2"
}];
$scope.children = [{
"id": "1",
"total": "2",
"owner": "1",
"name": "child 1"
}, {
"id": "2",
"total": "2",
"owner": "2",
"name": "child 2"
}, {
"id": "3",
"total": "1",
"owner": "2",
"name": "child 3"
}];
var random = Math.floor(Math.random() * $scope.owners.length);
$scope.selectedOwner = $scope.owners[random];
$scope.childrenList = $scope.children.filter(function(x) {
return x.owner == $scope.selectedOwner.id;
});
$scope.remove = function(child) {
}
$scope.ownerChange = function(owner) {
$scope.selectedOwner = owner;
$scope.childrenList = $scope.children.filter(function(x) {
return owner.id == $scope.selectedOwner.id;
});
}
$scope.data = [];
$scope.add = function(child) {
$scope.totalInit = filterFilter($scope.children, {
id: child.id
});
var total = $scope.totalInit.sum("number");
var complete = filterFilter($scope.data, {
id: +child.id
}).length;
var number = +complete + 1;
var input = {
"id": child.id,
"name": child.name,
"number": number
};
if (+number >= +child.total) {
$scope.children = $scope.children.filter(function(x) {
return x.id != child.id;
});
$scope.ownerStatus = filterFilter($scope.data, {
id: child.id
}).length;
if ($scope.ownerStatus === 0) {
$scope.owners = $scope.owners.filter(function(x) {
return x.id != child.owner;
});
}
}
$scope.data.push(input);
};
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<!DOCTYPE html>
<html ng-app="plunker">
<head>
<meta charset="utf-8" />
<title>Test</title>
</head>
<body ng-controller="MainCtrl">
<p><b>The bug:</b> Right now when the total data items added meets the item requirement, the item is removed from the list, but the list isn't refreshing the view with the item removed in the select dropdown or child list.</p>
<p>---------------------------------------------------------</p>
<b>Select Owner:</b>
<select ng-options="o.name for o in owners track by o.id" ng-model="selectedOwner" ng-change="ownerChange(selectedOwner)">
</select>
<ul>
<li ng-repeat="c in childrenList">{{c.name}}
<button ng-click="add(c)">Add</button>
</li>
</ul>
<b>Data:</b>
<ul>
<li ng-repeat="d in data">{{d.name}}
<button ng-click="data.splice($index, 1)">Remove</button>
</li>
</ul>
</body>
</html>
有什麼問題?當您在下拉列表中進行更改時,列表無法正確顯示? – Pradeepb
當我進行更改(從數組中刪除項目)時,下拉選項和列表在視圖中不會更新。 – pixeloft