如何在ng2-smart-table中添加自定義css

我正在使用angular2與ng2-smart-table。如何在ng2-smart-table中添加自定義css

這是我的代碼。

settings = { 
    mode:"external", 
    actions:{add:false,position:'right',custom: [{ name: 'View', title: `<i class="fa fa-eye" aria-hidden="true"></i>` }]}, 
    edit: { 
     editButtonContent: '<i class="fa fa-pencil-square" aria-hidden="true"></i>', 
     saveButtonContent: '<i class="ion-checkmark"></i>', 
     cancelButtonContent:'<i class="ion-close"></i>', 
    }, 
    delete: { 
     deleteButtonContent: '<i class="fa fa-trash" aria-hidden="true"></i>', 
     confirmDelete: true 
    }, 
    columns: { 
     Check:{ 
     title: "Check", 
     type: 'html', 
     }, 
     filter: false 
     }, 
     orderby:{ 
     title: "Name", 
     filter: true 
     }, 
     purchased:{ 
     title: "Purchased", 
     type: 'html', 
     }, 
     filter: false 
     }, 
     shipto:{ 
     title: "Ship To", 
     filter: true 
     }, 
     date:{ 
     title: "Date", 
     filter: true 
     }, 
     total:{ 
     title: "Total Amount", 
     filter: true 
     }, 
     status: { 
     title: "Status", 
     filter: true 
     } 
    } 
    };

我在表中添加了自定義視圖圖標。它的工作原理，但如何添加自定義CSS在ng2智能表？

我想這

ng2-smart-table thead > tr > th { background-color: blue; }

但它不工作。

來源

2017-08-26 sarankani

嘗試使用host來製作組件樣式，因爲沒有設置view encapsulation。在主機和hostcontext

:host /deep/ ng2-smart-table thead > tr > th { 
     background-color:blue; 
}

更多信息link

來源

2017-08-26 08:05:38

下面的SCSS改變文件

:host /deep/ ng2-smart-table-title a:focus { color: #009ECE; } 

:host /deep/ ng2-smart-table thead > tr > th > div { color: #009ECE; } 

:host /deep/ td.ng2-smart-actions a {cursor: pointer;color: #009ECE; }

來源

2017-10-14 07:29:43

我們可以直接使用我現在用的是相同的，下面我已經取得了表中的變化在我的代碼中。

:host>>>table tr th { 
    // your css here. 
}

來源

2017-10-24 11:25:24

如何在ng2-smart-table中添加自定義css

回答

相關問題