select element with ng-model/ng-options not working in directive transclude

[leefernandes]

Using the select element inside of the transclude scope, I would expect the change to update the parent scope value, as it does from parent scope. But it is not.

http://jsfiddle.net/ItsLeeOwen/rErsu/

[geddski]

The reason is because transcluded items get their own scope that's a sibling to the directive's scope. You'll notice that when you change the parent scope the transclude scope updates, but not the other way around. That's because the transclude scope prototypically inherits from the parent scope. But once you use the select option, a new own property color is being created on the transclude scope, effectively "masking" the color variable of the parent scope. Does that make sense?

So the best way to fix this that I know of is to manually bind the color variable of the parent and the transclude scope together. I created a sync directive that does this. Here's a fork of your fiddle that shows it working. Let me know if you have any questions.

I do think Angular could probably handle this a little better.

[btford]

As part of our effort to clean out old issues, this issue is being automatically closed since it has been inactivite for over two months.

Please try the newest versions of Angular (1.0.8 and 1.2.0-rc.1), and if the issue persists, comment below so we can discuss it.

Thanks!