Угловой 4: объект модели формы не содержит значения даты при отправке

В настоящее время я использую средство выбора даты начальной загрузки в проекте angular 4.

Когда я выбираю дату из средства выбора даты и отправляю форму, значение даты только не входит в объект модели, оно становится неопределенным

Я добавил свой код формы и машинописный код ниже, пожалуйста, дайте мне знать, что является проблемой с моим кодом.

<form name="details-form" #myform="ngForm" (ngSubmit)="getData(myform)" >
    <h4 class="message-heading">Establish new Opportunity</h4>    
    <div class="input-eta">
    <div class="input-label">the ETA?</div>
    <div class="datepicker-box " data-provide="datepicker" data-date-autoclose="true">
       <span class="icons icon-calendar input-group-addon"></span>        
    **<input type="date" placeholder="mm-dd-yyyy" name="datepicker" 
                        id="datepicker"  
                        [(ngModel)]="sModel.datepicker" 
                        #datepicker="ngModel" />**
    </div>
    <div class="input-other-details">
    <div class="input-label">Other details</div>
    <textarea placeholder="Type here" name="otherdetails"  [(ngModel)]="sModel.otherdetails"  #otherdetails="ngModel" ></textarea>
    </div>
    <div class="buttons-row">
    <a href="javascript:;" class="btn btn-border btn-cancel" data-dismiss="modal">Cancel</a>
    <button type="submit" [disabled]="!focusForm.form.valid" class="btn btn-primary btn-submit">Submit</button>          
    </div>
</form>

export class myValueComponent implements OnInit{
**sModel:any = {};**
  constructor(){}

  **getData(modalData){   
    console.log("modalData",modalData.value);
    return false;
  }**

  ngAfterViewInit(){       

  }
}

1 ответ

Я предлагаю вам использовать пакет ngx-bootstrap для всех поведенческих компонентов (Bootstrap) JavaScript. Вот быстрая ссылка на компонент datepicker и как его реализовать: https://valor-software.com/ngx-bootstrap/

Другие вопросы по тегам