Custom buttons for p-calendar in Primeng

时间:2017-12-18 06:55:14

标签: angular primeng

I am trying to integrate custom buttons apart from Today and Clear in p-calendar.Is there any way to that? Also, how do I change the label 'Clear' to something like 'Empty' ?

Thanks

1 个答案:

答案 0 :(得分:3)

To change Clear label, just use the <!doctype html> <html ng-app="plunker"> <head> <meta charset="utf-8"> <title>AngularJS Plunker</title> <link rel="stylesheet" href="style.css"> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/ng-currency/1.2.3/ng-currency.js"></script> <script src="app.js"></script> </head> <body> <div class="container" ng-controller="ApplicationController"> <div class="row"> <input type="text" ng-model="amount" currency-symbol="" ng-currency fraction="4" /> </div> </div> </body> </html> property (see Localization part from the doc).

To add custom buttons, you can add a custom template (see Custom Content part from same doc).

locale

and

<p-calendar [(ngModel)]="dateValue" showButtonBar="true" [locale]="en">
    <p-footer>Cutom footer with custom buttons</p-footer>
</p-calendar>