I am having an issue with my angular directives where the arguments are not being passed into the scope:
app.directive('sectionLeft', function() {
return {
restrict:'E',
scope: {
sectionContent: '=',
sectionImg: '='
},
templateUrl: 'partials/section_left.html'
};
});
app.directive('sectionRight', function() {
return {
restrict:'E',
scope: {
sectionContent: '=',
sectionImg: '='
},
templateUrl: 'partials/section_right.html'
};
});
These directives are called from here:
<div ng-repeat="content in data.home">
<section-left ng-if="$even" sectionContent="{{content}}" sectionImg="http://placehold.it/700x450"></div>
<section-right ng-if="$odd" sectionContent="{{content}}" sectionImg="http://placehold.it/700x450"></div>
</div>
and their structure looks like this:
<div class="section">
<div class="container">
<div class="row">
<div class="col-lg-6 col-md-6 col-sm-6">
{{sectionContent}}
</div>
<div class="col-lg-6 col-md-6 col-sm-6">
<img class="img-responsive" src="{{sectionImg}}">
</div>
</div>
</div>
</div>
The issue I am facing is that despite setting the attributes on the directive element, the result is just a blank space with no content. Can anyone help me figure out what's going wrong?
Thank you for your assistance!