我想在点击按钮时访问屏幕上下一个项目的参数.
我在我的html文件中使用ng-repeat:
<li ng-repeat="item in items | filter:query" ng-show="isSelected($index)">
<a href="" ng-click="itemNext()"><img src="xxx.jpg" /></a>
</li>
和我的控制器中的索引循环:
$scope.itemNext = function () {
$scope._Index = ($scope._Index < $scope.nbItems - 1) ? ++$scope._Index : 0;
$scope.functionToCallWithNextItem(nextItem.param1);
};
一个简单$scope.items[$scope._Index].param1的,而不是nextItem.param1作为数据进行过滤,这样是行不通$index+1的$scope.items不一定是好的.
任何的想法 ？
我在我的html文件中使用ng-repeat来显示过滤的项目:
<li ng-repeat="item in (filteredItems = (items | filter:query))">
{{ item.name }}
</a>
在控制器中,我想根据他的一个属性获取项目的索引.
精度:我想在过滤列表中获取索引,而不是在整个列表中.
例如,这将是女巫名称的索引some_item_7.
var app = angular.module('myApp', []);
app.controller('MyCtrl', ['$scope',
function MyCtrl($scope) {
$scope.query = 'some';
$scope.items =
[
{ name: 'some_item_1' },
{ name: 'another_item_2' },
{ name: 'some_item_3' },
{ name: 'another_item_4' },
{ name: 'some_item_5' },
{ name: 'another_item_6' },
{ name: 'some_item_7' },
{ name: 'another_item_8' },
{ name: 'some_item_9' }
];
$scope.itemNext = function (item) { …我正在尝试使用CSS网格布局模块来显示12列-3行网格。
我需要第一行仅显示2个元素（第一个在网格的左侧，第二个在右侧）。我用10个周期用空单元格分隔它们。
然后，我需要以下几行以自动显示其余元素。
我决定继续grid-template-areas对定位进行更多控制，但可能并不是最好的方法，因为似乎我必须grid-area对所有元素都使用特定的名称。
另外，当我尝试对其余单元格使用auto grid-area属性，以便它们可以自动填充第三行时，似乎它们填充了第一行中的空白单元格。
解决这个问题的最有效方法是什么？
这是我的代码：
.grid {
display: grid;
grid-template-areas:
"elem1 . . . . . . . . . . elem2"
"elem3 elem4 elem5 elem6 elem7 elem8 elem9 elem10 elem11 elem12 elem13 elem14";
}
.elem{
text-align: center;
color: white;
}
.elem1 {
background-color: blue;
grid-area: elem1;
}
.elem2 {
background-color: red;
grid-area: elem2;
}
.elem3 {
background-color: cyan;
grid-area: elem3;
}
.elem4 {
background-color: green;
grid-area: elem4;
}
.elem5 { …我正在关注这篇文章:如何使用多个链接过滤AngularJS中的列表
现在我想在点击时显示由多个参数过滤的数据.
HTML
<div ng-app>
<span ng-click="myFilter = {type: 1}">Type 1</span> |
<span ng-click="myFilter = {type: 2}">Type 2</span> |
<span ng-click="myFilter = {type: 3}">Type 3</span> |
<!-- multiple filter - not working -->
<span ng-click="myFilter = [{type: 1}, {type:3}]">Types 1 & 3</span> |
<span ng-click="myFilter = null">No filter</span>
<ul ng-controller="Test">
<li ng-repeat="person in persons | filter:myFilter">{{person.name}}</li>
</ul>
</div>
JS
function Test($scope) {
$scope.persons = [{type: 1, name: 'Caio'}, {type:2, name: 'Ary'}, {type:1, name: 'Camila'}, , {type:3, name: 'Daniel'}];
} …