是否可以将ng-repeat外部作用域中的属性,方法或函数用作列表表达式?当然可以访问 Controller 的作用域,但是ng-repeat指令周围的组件又如何呢?
我想详细说明一些问题,以使我的问题更加清楚。
当前,我正在尝试编写类似于JSF数据表的组件(或类似于AngularPrime的puiDatatable,请参见http://angularprime.appspot.com/#/puiDatatable/sortSelection)。 HTML代码如下所示:
<pui-datatable>
<pui-row ng-repeat="row in ctrl.carTable" >
<pui-column header="Brand" sortable="true">{{row.brand}}</pui-column>
<pui-column header="Type"> {{row.type}} </pui-column>
<pui-column header="Year" sortable="true">{{row.year}} </pui-column>
<pui-column header="Color" sortable="true">{{row.color}}</pui-column>
<pui-column header="edit">
<button ng-click="row.editCar()">edit car</button>
</pui-column>
</pui-row>
</pui-datatable>
我已经设法编写了一个不错的版本。但是,我发现很难实现排序功能。最简单的想法是用函数调用将ng-repeat的列表表达式括起来,如下所示:
<pui-row ng-repeat="row in sort(ctrl.carTable)">
要么
<pui-row ng-repeat="row in PuiDatatable.sort(ctrl.carTable)">
但是,我似乎无法访问组件的全局功能或静态功能,更不用说组件本身实例的功能了。
到目前为止,我最好的猜测是使用过滤器,但这很笨拙。
有任何想法吗?也许替代方法?
最佳答案
在angular中有一个排序过滤器,称为orderBy:
<pui-datatable>
<pui-row ng-repeat="row in ctrl.carTable | orderBy:'brand'" >
<pui-column header="Brand" sortable="true">{{row.brand}}</pui-column>
<pui-column header="Type"> {{row.type}} </pui-column>
<pui-column header="Year" sortable="true">{{row.year}} </pui-column>
<pui-column header="Color" sortable="true">{{row.color}}</pui-column>
<pui-column header="edit">
<button ng-click="row.editCar()">edit car</button>
</pui-column>
</pui-row>
</pui-datatable>
当您要构建自定义过滤器时,请使用NgFilter批注:
@NgFilter(name:'sort')
class Sort{
call(valueToFilter, optArg1, optArg2) {
return valueToFilter.sort();
}
}
关于dart - 如何从AngularDart中的ng-repeat范围访问组件的属性?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22793177/