Question

我在AngularJS环境中工作。

我有下表的图表图片，我正在转换为ng-repeat。

我已设法仅分配我想要显示的记录，但使用下面的GadgetIconsCtrl。现在我需要每行显示两个<td>个元素。

如何使用<td>每行显示两个ng-repeat个元素？

<table id="gadgets" class="propertyTable clickable_row">

        <tr>
            <th>Type</th>
        </tr>
        <tr>
            <td data-url="chart_treelist">
                <img data-draggable id="chart_treelist" src="images2/table.png" title="Tree Grid" alt="Hierarchy Grid" width="64" height="64">Grid
            </td>   
            <td data-url="{chart_pivot}">
                <img data-draggable id="chart_pivot" src="images2/pivottable.png" title="Pivot Table"   alt="Pivot Table" width="64" height="64">Pivot
            </td> 
        </tr>
              
    </table>

当用户启动嵌入此表的模态窗口时，我需要立即突出显示特定的<td>元素。

以下是一些$scope.widgets图表属性的示例：

$scope.widgets[0].title = "Bar Chart" $scope.widgets[0].gadgetType = "chart" $scope.widgets[0].chartType = "bar" 到目前为止，我正在使用ng-repeat，但无法应用filter

这是ng-repeat和附加到它的控制器：

(function () {
    'use strict';
    angular.module('rage')
       .controller('GadgetIconsCtrl', ['$rootScope', '$scope',  icons]);

    function icons($rootScope, $scope) {

        var gadicons = this;

        gadicons.widgetSubset = null;

        if ($scope.widget.gadgetType == 'chart' && $scope.widget.chartType == 'bar') {
            gadicons.widgetSubset = _.filter($scope.widgetDefs, function (item) {
                return item.chartType == 'bar' || item.chartType == 'column';
            });
        }
    };   // end of gridSettings()    
})();

        <table ng-controller="GadgetIconsCtrl as gadicons">
            <tr ng-repeat="widget in gadicons.widgetSubset" ng-class="" >
                <td>
                    <img data-draggable ng-src="{{widget.initImage}}" title="{{widget.title}}" alt="Hierarchy Grid" width="64" height="64">{{widget.title}}
                </td>
            </tr>
        </table>

非常感谢您的建议。

的问候，鲍勃

Answer 1

抱歉，我之前给出了错误的答案。因此，您希望根据范围更改过滤器类型。这是一个工作的基本小提琴，可以帮助你抽象答案。如果你想获得更多有角度的帮助，如果你有兴趣，请在我的网站上给我发一封电子邮件，我想更多地谈谈角度。

工作小提琴https://jsfiddle.net/E6aMZ/26/

<div ng-repeat"thing in things | filter:myThings"></div>

使用Angular的ng-repeat正确格式化表格

1 个答案: