fix(datepicker) ng-model not working within another directive

[jbenowitz]

I have a custom directive in which my template refers to datepicker. Everything loads correctly, however it's not responding to an ng-model. For example, this code:

<datepicker ng-model="startDate" show-weeks="false" max="endDate">   </datepicker>
<input type="date" ng-model="startDate"></input>
{{startDate}}

When fiddling around with the datepicker, the {{startDate}} doesn't appear, however, changing the input, it does appear. Secondly, changing the input does not update the datepicker.

[hallister]

You'll probably have to post a plunker showing the issue. But my guess is a scoping issue. A simple test is changing your ng-model="startDate" to ng-model="$parent.startDate"

[pkozlowski-opensource]

@jbenowitz not sure if the suggestion from @hall5714 is fixing your problem or not so going to close this one for now. Please re-open with a live reproduce scenario using plunker if you still need support.

[jbenowitz]

Thanks -- sorry, had to deal with pressing issues before this one. It seemed on the ng-model i had to call $parent.$parent.startDate, but on the others, call $parent.startDate. It deals with how my heirarchy is formed, which kinda sucks. Thanks for your help, though.

[henrikingo]

Hi

First of all, thanks for this. I had the same issue and it was really hard to understand what was going on. $parent.$parent.variable solves it.

It turns out, the same happens for all fields in the form, not just Datepicker. It's just more obvious in Datepicker as it fails to even work, but according to my tests just a simple text input field fails to update the ng-model variable too, unless you use $parent.$parent.variable.

This seems to be caused by using the accordion tag. If I remove the accordion, then things work as usual. Just wanted to record this for anyone else stumbling on the same.

[ookadoo]

henrikingo, thanks for your comment it helped me realize my problem was accordion as well.

[chrisirhc]

Just wanted to note that there's a FAQ for this issue. Such an issue arises from use of any directive that creates child scopes such as ngRepeat or ngIf.
https://github.com/angular-ui/bootstrap/wiki/FAQ#my-input--select-element-doesnt-work-as-expected-inside-the-tab--accordion-directive