How to dynamically include all template partials when using a module in AngularJS -


i have several modules require template partials loaded whenever module used. storing these files in folder called partials inside each module subfolder. starting point app meanjs, , storing partials file in public/modules//partials/*.html.

i have seen several ng-include , directive examples, being new angularjs each sample read confuses me further best practice / angularjs appropriate way this.

store partials whenever wants. load them use angular template cache.

use grunt or gulp generate automatically. use gulp.

here working example of 1 of project.

install nodejs , npm

npm intall gulp -g

npm install gulp-angular-templatecache

create gulpfile.js

var templatecache = require('gulp-angular-templatecache'),     watch = require('gulp-watch');  gulp.task('generate', function () {     gulp.src('public/*/partials/*.html')         .pipe(templatecache('templates.js', {module: 'yourmodulename', standalone: false}))         .pipe(gulp.dest('public/js')); });  gulp.task('watch-partials', function () {     gulp.watch('public/*/partials/*.html', ['generate']); }); 

then use this:

gulp generate - regenerate partials

gulp watch-partials - watch file changes, if partials changed automatically run generate task you. :)

one more thing, dont forget include template.js in html file

<script src="public/js/template.js"></script>

every time change partial dont forget regenerate template cache.


Comments

Popular posts from this blog

java - Oracle EBS .ClassNotFoundException: oracle.apps.fnd.formsClient.FormsLauncher.class ERROR -

c# - how to use buttonedit in devexpress gridcontrol -

nvd3.js - angularjs-nvd3-directives setting color in legend as well as in chart elements -