I am trying to use a common partial template for a couple of views in my application. But for some reason the partial does not load the elements defined in the parent scope (Most probably because ng-include creates a new child scope). How can I get access to the elements defined under the parent scope.
<div id="application" ng-app="myapp">
<div id="content">
<!-- Main Application View for Auto Updating -->
<div ng-view></div>
</div>
</div>
<!-- some html -->
<div ng-include="'/partials/common_partial.html'"></div>
{{ item.name }}
{{ item.code }}
{{ item.expiry }}
Now I want to add common_partials.html to different view/controllers where within a controller's scope i set the element item. Say, in the above view's controller I do $scope.item = {'name': 'Test', 'code': 'DS3F432DI', 'expiry': '30 Days'}
Now if I directly call {{item.name}} in the view it renders the name but not within the partial added using ng-include how can i access {{item.foo}} in common_template.html ?