我想要表演"经验水平列表"在col-lg-3中更新col-lg -8中的数据 - 当col-lg-8中的用户选择复选框时,应该在col-lg-8上显示更新数据。我试过代码请帮帮我。
<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.0-beta.2/angular.min.js">
</script>
<script src="https://code.angularjs.org/1.5.0-beta.0/angular-route.min.js"> </script>
</head>
<body>
<div ng-app="demo">
<div class="container">
<div class="col-lg-3">
</div>
<div class="col-lg-9">
<div ng-controller="myCtrl">
<b>Experience Level:</b>
<div ng-repeat="cat in getCategories()">
<b><input type="checkbox" ng-model="filter[cat]" /> {{cat}}</b>
</div>
<hr /> Your Search Results: {{filtered.length}}
<br>
<br>
<div class="row">
<div class="col-lg-12" ng-repeat="w in filtered=(experience | filter:filterByCategory)">
{{w.name}}
<hr />
</div>
</div>
<div>
</div>
</div>
</div>
<script>
var app = angular.module('demo', ['ngRoute']);
app.controller('myCtrl', function($scope, $http) {
$scope.experience = [{
name: "Java developer",
category: "Entry Level ($)"
}, {
name: "Mean-Stack developer",
category: "Entry Level ($)"
}, {
name: "Java developer",
category: "Entry Level ($)"
}, {
name: "web developer",
category: "Entry Level ($)"
}, {
name: "java developer",
category: "Intermediate ($$)"
}, {
name: "Mean-Stack developer",
category: "Intermediate ($$)"
}, {
name: ".net developer",
category: "Intermediate ($$)"
}, {
name: "WCF developer",
category: "Expert ($$$)"
}, {
name: "Spring developer",
category: "Expert ($$$)"
}, {
name: "UI/UX ",
category: "Entry Level ($)"
}
];
$scope.filter = {};
$scope.getCategories = function() {
return ($scope.experience || []).map(function(w) {
return w.category;
}).filter(function(w, idx, arr) {
return arr.indexOf(w) === idx;
});
};
$scope.filterByCategory = function(experience) {
return $scope.filter[experience.category] || noFilter($scope.filter);
};
function noFilter(filterObj) {
for (var key in filterObj) {
if (filterObj[key]) {
return false;
}
}
return true;
}
});
</script>
</body>
</html>
答案 0 :(得分:1)
尝试此代码并告诉我它是否适合您..
>df
#x y
#a 1
#b 1
#a 2
#c 1
#b 2