Is it possible to dynamically control a directive's template based on an evaluated $scope variable in Angular?
For instance, the following code may not work as expected due to how $scope is being utilized:
app.directive('inputType', function(){
var template;
if ($scope.inputType === 'input') {
template = "<input ng-attr-my-attribute='" + $scope.myAttribute + "' />";
}
return {
restrict: 'E',
scope: {
inputType: '=',
myAttribute: '='
},
template: template
}
})
<inputType inputType="input" my-attribute="some value"></inputType>
In this example, the goal is to use a dynamic $scope property to determine the type of HTML element (input, textarea, checkbox, etc) in the directive.