@@ -87,6 +87,61 @@ Check the Grunt build file for other tasks that are defined for this project.
87
87
88
88
This will start Karma server and will continously watch files in the project, executing tests upon every change.
89
89
90
+ ### Customize templates
91
+
92
+ As mentioned directives from this repository have all the markup externalized in templates. You might want to customize default
93
+ templates to match your desired look & feel, add new functionality etc.
94
+
95
+ The easiest way to override an individual template is to use the <script > directive:
96
+
97
+ ``` javascript
98
+ < script id= " template/alert/alert.html" type= " text/ng-template" >
99
+ < div class = ' alert' ng- class = ' type && "alert-" + type' >
100
+ < button ng- show= ' closeable' type= ' button' class = ' close' ng- click= ' close()' > Close< / button>
101
+ < div ng- transclude>< / div>
102
+ < / div>
103
+ < / script>
104
+ ```
105
+
106
+ If you want to override more templates it makes sense to store them as individual files and feed the ` $templateCache ` from those partials.
107
+ For people using Grunt as the build tool it can be easily done using the ` grunt-html2js ` plugin. You can also configure your own template url.
108
+ Let's have a look:
109
+
110
+ Your own template url is ` views/partials/ui-bootstrap-tpls/alert/alert.html ` .
111
+
112
+ Add "html2js" task to your Gruntfile
113
+ ```
114
+ html2js: {
115
+ options: {
116
+ base: '.',
117
+ module: 'ui-templates',
118
+ rename: function (modulePath) {
119
+ var moduleName = modulePath.replace('app/views/partials/ui-bootstrap-tpls/', '').replace('.html', '');
120
+ return 'template' + '/' + moduleName + '.html';
121
+ }
122
+ },
123
+ main: {
124
+ src: ['app/views/partials/ui-bootstrap-tpls/**/*.html'],
125
+ dest: '.tmp/ui-templates.js'
126
+ }
127
+ }
128
+ ```
129
+
130
+ Make sure to load your template.js file
131
+ ` <script src="/ui-templates.js"></script> `
132
+
133
+ Inject the ` ui-templates ` module in your ` app.js `
134
+ ```
135
+ angular.module('myApp', [
136
+ 'ui.bootstrap',
137
+ 'ui-templates'
138
+ ]);
139
+ ```
140
+
141
+ Then it will work fine!
142
+
143
+ For more information visit: https://github.com/karlgoldstein/grunt-html2js
144
+
90
145
### Release
91
146
* Bump up version number in ` package.json `
92
147
* Commit the version change with the following message: ` chore(release): [version number] `
0 commit comments