Per rendere due ng2-datetimepickers e ottenere il suo valore

Sto usando https://github.com/CuppaLabs/angular2-datetimepicker . Tuttavia, nella mia forma, voglio due raccoglitori di date. Uno per -> Da: e l’altro per -> A: scopo. Come ottenere / catturare i loro valori. Perché non riesco a capire come differenziare e scrivere codici per due raccoglitori DateTime. Puoi per favore aiutare. Voglio anche che i popup di datetimepicker siano allineati bene con le caselle di input nella vista (html). Sono dis-allineati.

ecco l’immagine:

Datalepicker disallineati o selettori di data e ora sovrapposte

component.html

From:
To:
:://more code

    component.ts

      export class TransactionComponent implements OnInit { settings = { bigBanner: true, timePicker: true, // format: 'dd-MM-yyyy', defaultOpen: false } constructor() { DatePicker.prototype.ngOnInit = function() { this.settings = Object.assign(this.defaultSettings, this.settings); if (this.settings.defaultOpen) { this.popover = true; } this.date = new Date(); console.log("DateTimepicker date is =" +this.date) }; 

    component.css

      #addbtn{ float:right; } thead>tr>th:hover { cursor: pointer; background-color: #384c57; color: rgb(240, 202, 132); box-shadow: 0 4px 8px rgba(0, 0, 0, 0.12), 0 4px 8px rgba(0, 0, 0, 0.24); } th{ width:1px;white-space:nowrap; } .glyphicon-th{ vertical-align: middle; } table{ font-family: Arial, Helvetica, sans-serif; table-layout: fixed; display: block; overflow: scroll; } thead{ background-color: #33444d; color: white; } .card{ border: none !important; } #faIcon{ background: #2f4855; color: white; border: none; } input:hover { background-color: rgb(247, 185, 114) } input:focus{ border : 2px solid rgb(247, 185, 114) !important; } .panel { border: none; margin-bottom: 0 } .panel-transparent { background: none; } #searchTableStyle{ overflow:visible; background-color:transparent; border:transparent; position: relative } .table{ color:rgb(255, 255, 255); background-color:rgba(17, 26, 24, 0.452); } .panel-transparent .panel-heading{ background: rgba(44, 51, 59, 0.575)!important; text-align: center; color: #fff; } .my-pagination /deep/ .ngx-pagination .current { background: #33444d; }