0

私は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側。

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で列の定義を定義するか、ユーザーが列の定義を未定義の場合、私のアプリ. 列を動的に作成します。しかし、私はこれを行う方法がわかりません。ユーザーが列を定義する方法、または列を動的に作成する方法を教えてください。ps: 下手な英語でごめんなさい。

4

1 に答える 1

0

columnsおそらく、行オブジェクトで使用されるプロパティの名前をリストする配列もスコープに入れたいと思うでしょう。ユーザーにディレクティブのパラメーターとして指定するように要求するか、for..inループのようなものを使用して、行内の行オブジェクトの 1 つから取得することによって、この列配列を埋めることができます ( Javascript オブジェクトのすべてのプロパティ値を取得する方法も参照してください)。 (キーを知らずに)?オブジェクトのすべてのプロパティを取得する他の方法)。これがあれば、次のようなことができます

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

ユーザーに列配列を指定させると、一部の列のみを選択して順序を指定できるため、より適切な場合があります。

于 2013-09-18T21:45:07.413 に答える