javascript - 按钮中的 AngularJS angular-datatables 自定义属性

Question

我在 npm 中使用以下内容:

"dependencies": {
    "angular": "1.6.4",
    "datatables.net": "1.10.19",
    "datatables.net-buttons": "1.5.3",
    "datatables.net-buttons-dt": "1.5.3",
    "angular-datatables": "0.6.2",
    // and more that is not question related
}

当我现在创建一个数据表时，就像示例中的 angular-datatables 所说的那样，一切都运行良好。
例如:

vm.dtOptions = DTOptionsBuilder
    .newOptions()
    // data fetch and processing animation and ...
    .withButtons([
        'colvis',
        'copy',
        'print',
        'excel',
        'pdf',
        {
            text: 'Some button',
            key: '1',
            action: function (e, dt, node, config) {
                alert('Button activated');
            },
            className: 'someCustomCssClass',
        },
    ])
    .withBootstrap();
vm.dtColumns = [
    DTColumnBuilder.newColumn('id').withTitle('ID').withClass('text-danger'),
    DTColumnBuilder.newColumn('firstName').withTitle('First name'),
    DTColumnBuilder.newColumn('lastName').withTitle('Last name')
];

现在我想修改自定义按钮“Some button”。
我希望按钮具有自定义 HTML 属性。

当前 Button 被渲染成这样:

<button class="dt-button someCustomCssClass ng-scope" tabindex="0" aria-controls="DataTables_Table_0" type="button">
    <span>Some button</span>
</button>

但是按钮应该有一个“访问”属性，以便根据用户 Angular 色隐藏/显示按钮。
所以它应该是例如:

<button access="ROLE_ADMIN" class="dt-button someCustomCssClass ng-scope" tabindex="0" aria-controls="DataTables_Table_0" type="button">
    <span>Some button</span>
</button>

但是我怎样才能给一个按钮添加一个新的属性呢？
使用“className”添加自定义 CSS 类很容易，但是一个全新的属性呢？

感谢您的帮助和
问候

更新

目前我正在附加一个完全自定义的按钮，如下所示:

var myEl = angular.element( document.querySelector( '.dataTables_wrapper > .dt-buttons' ) );
myEl.append('<button with all my needs></button>');
$compile(myEl.contents())(scope);

这是可行的，但现在我不能使用 DataTable 信息，而且集成本身很差。
这也是一种解决方法，根本没有好的解决方案!
我真的希望@davidkonrad 提到的 init 可以解决这个问题。

Answer 1

使用 init回调您想要使用自定义属性丰富的按钮:

.withButtons([
    'colvis',
    'copy',
    'print',
    'excel',
    'pdf',
    {
        text: 'Some button',
        key: '1',
        action: function (e, dt, node, config) {
            alert('Button activated');
        },
        className: 'someCustomCssClass',
        //-----------------------------------
        init: function(dt, node, config) {
            node.attr('access', "ROLE_ADMIN")
        }
    },
])