Question

我是angular.js的新手。我想创建基本网格来学习angular.js。我用angular.js创建了一个博客应用程序，但我想了解更多。我正在开始开发网格应用程序。这个网格将动态地进行crud操作。我在html那边写这个;

< bar-table 
bar-list-action="'/json/customers.htm'" 
bar-delete-action="'/api/DeleteCustomer'" 
bar-update-action="'/api/UpdateCustomer'" / >

和js side;

barbarapp.directive("barTable", function ($http) {
    return {
        restrict: 'E',
        templateUrl: '/templates/customers.html',
        scope: {
            barSource: '=',
            barListAction: '=',
            barDeleteAction: '=',
            barUpdateAction: '=',
            barTemplateUrl: '='
        },
        link: function (scope, element, attr) {
            var listAction = scope.barListAction;
            $http.get(listAction)
                .success(function (response) {
                    scope.rows = response.records;
                });

            scope.deleteAction = function (row) {
                //scope.barDeleteAction

            };
            scope.updateAction = function () {
                //scope.barUpdateAction
            };
        }
    };
});

和模板;

< table class="table table-hover">
    < tr ng-repeat="row in rows" >
        < td >{{row.Id}}< /td >
        < td >{{row.Name}} < /td >
        < td >
            < input type="button" value="Sil" ng-click="deleteAction(row)" class="btn btn-danger" >
        </ td >
        < td >
            < input type="button" value="Güncelle" ng-click="updateAction(row)" class="btn btn-warning" >
        < /td >
    < /tr>
< /table >

我的想法; 用户在html中定义列defination或者如果用户取消定义列defination，我的应用程序。创建动态列。但我不知道该怎么做。请向我展示用户的定义列或动态创建列。 p.s：sory因为我的英语不好。

Answer 1

您可能希望在范围中也有一个columns数组，其中列出了行对象中使用的属性的名称。您可以通过要求用户将其指定为指令的参数或使用类似for..in循环的内容来从行中的一个行对象中获取它来填充此列数组（另请参阅How to get all properties values of a Javascript Object (without knowing the keys)?获取对象的所有属性的其他方法）。如果你有这个，你可以做类似的事情

<tr ng-repeat="row in rows">
    <td ng-repeat="col in columns">
        {{row[col]}}
    </td>
    <!-- other td's for deleting etc. -->
</tr>

让用户指定columns数组可能更合适，因为它允许他们只选择一些列并指定顺序。

AngularJS创建元素

1 个答案: