{"action":"created","issue":{"url":"https://api.github.com/repos/ng-bootstrap/ng-bootstrap/issues/1582","repository_url":"https://api.github.com/repos/ng-bootstrap/ng-bootstrap","labels_url":"https://api.github.com/repos/ng-bootstrap/ng-bootstrap/issues/1582/labels{/name}","comments_url":"https://api.github.com/repos/ng-bootstrap/ng-bootstrap/issues/1582/comments","events_url":"https://api.github.com/repos/ng-bootstrap/ng-bootstrap/issues/1582/events","html_url":"https://github.com/ng-bootstrap/ng-bootstrap/issues/1582","id":231490928,"node_id":"MDU6SXNzdWUyMzE0OTA5Mjg=","number":1582,"title":"Feature: ngbDatePicker ngInvalid for Optional Field in Reactive Form","user":{"login":"mtpultz","id":599498,"node_id":"MDQ6VXNlcjU5OTQ5OA==","avatar_url":"https://avatars1.githubusercontent.com/u/599498?v=4","gravatar_id":"","url":"https://api.github.com/users/mtpultz","html_url":"https://github.com/mtpultz","followers_url":"https://api.github.com/users/mtpultz/followers","following_url":"https://api.github.com/users/mtpultz/following{/other_user}","gists_url":"https://api.github.com/users/mtpultz/gists{/gist_id}","starred_url":"https://api.github.com/users/mtpultz/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/mtpultz/subscriptions","organizations_url":"https://api.github.com/users/mtpultz/orgs","repos_url":"https://api.github.com/users/mtpultz/repos","events_url":"https://api.github.com/users/mtpultz/events{/privacy}","received_events_url":"https://api.github.com/users/mtpultz/received_events","type":"User","site_admin":false},"labels":[{"id":263376143,"node_id":"MDU6TGFiZWwyNjMzNzYxNDM=","url":"https://api.github.com/repos/ng-bootstrap/ng-bootstrap/labels/component:%20datepicker","name":"component: datepicker","color":"ffffff","default":false},{"id":260884034,"node_id":"MDU6TGFiZWwyNjA4ODQwMzQ=","url":"https://api.github.com/repos/ng-bootstrap/ng-bootstrap/labels/needs:%20plunkr%20/%20stackblitz","name":"needs: plunkr / stackblitz","color":"eb6420","default":false}],"state":"closed","locked":false,"assignee":null,"assignees":[],"milestone":{"url":"https://api.github.com/repos/ng-bootstrap/ng-bootstrap/milestones/3","html_url":"https://github.com/ng-bootstrap/ng-bootstrap/milestone/3","labels_url":"https://api.github.com/repos/ng-bootstrap/ng-bootstrap/milestones/3/labels","id":1317594,"node_id":"MDk6TWlsZXN0b25lMTMxNzU5NA==","number":3,"title":"Purgatory","description":"","creator":{"login":"wesleycho","id":1703387,"node_id":"MDQ6VXNlcjE3MDMzODc=","avatar_url":"https://avatars1.githubusercontent.com/u/1703387?v=4","gravatar_id":"","url":"https://api.github.com/users/wesleycho","html_url":"https://github.com/wesleycho","followers_url":"https://api.github.com/users/wesleycho/followers","following_url":"https://api.github.com/users/wesleycho/following{/other_user}","gists_url":"https://api.github.com/users/wesleycho/gists{/gist_id}","starred_url":"https://api.github.com/users/wesleycho/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/wesleycho/subscriptions","organizations_url":"https://api.github.com/users/wesleycho/orgs","repos_url":"https://api.github.com/users/wesleycho/repos","events_url":"https://api.github.com/users/wesleycho/events{/privacy}","received_events_url":"https://api.github.com/users/wesleycho/received_events","type":"User","site_admin":false},"open_issues":0,"closed_issues":166,"state":"open","created_at":"2015-09-22T00:38:33Z","updated_at":"2018-08-17T08:59:07Z","due_on":null,"closed_at":null},"comments":4,"created_at":"2017-05-25T23:54:40Z","updated_at":"2018-08-23T10:03:32Z","closed_at":"2017-05-26T08:37:05Z","author_association":"NONE","body":"### Feature description:\r\nThere's no way to have a date field be optional when using ngbDatePicker it always indicates the field is ngInvalid.  I tried setting the model to `''`, `null`, `undefined`.  Empty string means ngInvalid will prevent it from  being optional, and null/undefined works to make it optional, but it throws an error when null/undefined is split by `formatDate`. \r\n\r\n```\r\nprivate formatDate(date: string): { year: number, month: number, day: number } {\r\n  const { 0: year, 1: month, 2: day } = date.split('-'); \r\n  return { year: parseInt(year, 10), month: parseInt(month, 10), day: parseInt(day, 10) };\r\n}\r\n```\r\n\r\nLooks like this might just need a null check of some sort in `formatDate`, but it would be a better if it instead relied on Validations.required to be set by the developer instead so whether it is required is external to the directive making an empty string valid.\r\n\r\n**Example Form Model**\r\n\r\n```\r\nthis.form = this.formBuilder.group({\r\n  id: [\r\n    0, [Validators.required]\r\n  ],\r\n\r\n  // ... removed for brevity\r\n\r\n  business_type: [\r\n    '', [Validators.required]\r\n  ],\r\n  business_incorp_date: [\r\n    '', [] // <-- OPTIONAL FIELD, but always ngInvalid on { \"ngbDate\": { \"invalid\": { \"year\": null, \"month\": null, \"day\": null } } }\r\n  ],\r\n  business_desc: [\r\n    '', [Validators.required]\r\n  ]\r\n\r\n  // ...\r\n});\r\n```\r\n\r\n**Example Input**\r\n\r\n```\r\n<input type=\"text\"\r\n        id=\"business_incorp_date\"\r\n        class=\"form-control\"\r\n        formControlName=\"business_incorp_date\"\r\n        ngbDatepicker\r\n        #incorporatedDatePicker=\"ngbDatepicker\"\r\n        (click)=\"incorporatedDatePicker.toggle()\"\r\n        readonly>\r\n```\r\n\r\n### Version of Angular, ng-bootstrap, and Bootstrap:\r\n\r\nAngular: 4.1.1\r\n\r\nng-bootstrap: ^1.0.0-alpha.25\r\n\r\nBootstrap: 4.0.0-alpha.6\r\n"},"comment":{"url":"https://api.github.com/repos/ng-bootstrap/ng-bootstrap/issues/comments/415362410","html_url":"https://github.com/ng-bootstrap/ng-bootstrap/issues/1582#issuecomment-415362410","issue_url":"https://api.github.com/repos/ng-bootstrap/ng-bootstrap/issues/1582","id":415362410,"node_id":"MDEyOklzc3VlQ29tbWVudDQxNTM2MjQxMA==","user":{"login":"honzajde","id":3186360,"node_id":"MDQ6VXNlcjMxODYzNjA=","avatar_url":"https://avatars3.githubusercontent.com/u/3186360?v=4","gravatar_id":"","url":"https://api.github.com/users/honzajde","html_url":"https://github.com/honzajde","followers_url":"https://api.github.com/users/honzajde/followers","following_url":"https://api.github.com/users/honzajde/following{/other_user}","gists_url":"https://api.github.com/users/honzajde/gists{/gist_id}","starred_url":"https://api.github.com/users/honzajde/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/honzajde/subscriptions","organizations_url":"https://api.github.com/users/honzajde/orgs","repos_url":"https://api.github.com/users/honzajde/repos","events_url":"https://api.github.com/users/honzajde/events{/privacy}","received_events_url":"https://api.github.com/users/honzajde/received_events","type":"User","site_admin":false},"created_at":"2018-08-23T10:03:32Z","updated_at":"2018-08-23T10:03:32Z","author_association":"NONE","body":"the set Today button does not work in the above plunker  http://plnkr.co/edit/vgLDwtcBymGVoMr0WDbE?p=preview "}}
{"actor":{"display_login":"honzajde"}}