In the AngularJS directive and controller below, I want to dynamically set the `templateURL` based on values of integers `aB` and `aC` in the associated controller.
If the sum of `aB + aC` is greater than or equal to 10, I want it to use `foo.html`; otherwise, I want it to use `bar.html`. How can this be achieved?
myApp.directive('myDirective',function(){
return {
restrict:'E',
scope: {
myObject: '='
},
controller: 'myDirectiveCtrl',
controllerAs: 'myDrCtrl',
bindToController: true,
template: 'aB={{myDrCtrl.myObject.aB}} aC={{myDrCtrl.myObject.aC}}'
};
}
);
myApp.controller('myDirectiveCtrl', function($scope){
var self = this;
$scope.$watch(function() {return self.myObject}, function (objVal) {
console.log("watch fired");
console.log('objVal.aB = ', objVal.aB);
console.log('objVal.aC = ', objVal.aC);
},true);
});