Rename third-party directives or quickly generate simple template directives for use internally in your app!
- Sick of the
ui-*bs-*and other such prefixes cluttering up your beautiful html? - Always find you're calling the same set of directives together?
Now you can ALIAS it!
- Load
alias.js - Add
ui.aliasas a dependency - Create a
uiAliasConfigconstant on theui.aliasmodule
- Create a
constanton theui.aliasmodule - Keys are your alias, while the values are either a string template or a DirectiveDefinitionObject
- Aliases create new directives that generate templates
- Alias directives are
replace: trueby default unless explicitly set tofalse
angular.module('ui.alias').constant('uiAliasConfig', {
'alias': '<template dir1 dir2 options="customConfigScopeVar"></template>', // becomes <alias>
'alias2': {
template: '<another-template></another-template>',
restrict: 'AEC'
}
// Example:
date: '<input ui-date ui-date-format="mm/dd/yyyy">'
// becomes: <date>
});- Be careful to avoid creating an alias that fires recursively
Example:<button>→<ui-button>→<button> - You cannot override existing directives. Both the original and your alias directives will execute.
- You can create multiple aliases for different configurations of the same directives / templates