npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

angular-combine

v0.1.5

Published

Allow loading of merge templates into a single HTML file.

Downloads

9

Readme

angular-combine

Build Status: Linux

Allow loading of merge templates into a single HTML file.

Getting Started

This plugin requires Bower

If you haven't used Bower before, be sure to check out the Getting Started guide. Once you're familiar with that process, you may install this plugin with this command:

bower install angular-combine --save

Once the plugin has been installed, it may be enabled inside your application by adding the correpsonding module:

angular.module('myApp', ['angularCombine']);

Then you need to configure a specific service to help Angular in finding the merged templates. When the templateCache is asked for a template it will use the regex in the first argument to determine if there is a combined file that can be loaded to gather that template. The second argument is the url/path to the combined template to load. Example Below:

angular.module('myApp').config(function (angularCombineConfigProvider) {
	angularCombineConfigProvider.addConf(/^views\/admin\//, 'views/admin.html');
	angularCombineConfigProvider.addConf(/^views\/otherSubFolder\//, 'views/otherSubFolderMergedTemplates.html');
});

You can add as many conf as you need.

The "angularCombine" concept

Theory

Angular can load templates within an HTML by parsing script attribute with text/ng-template as type :

<script type="text/ng-template" id="one.html">
	<div>This is first template</div>
</script>
<script type="text/ng-template" id="two.html">
	<div>This is second template</div>
</script>

It allows us to use one.html or two.html as partials without having an extra HTTP call.

So, it may be interesting to have a way to merge partials into a single HTML file that would be load once and give access to a bunch of partials.

The difficult part then is to produce the merged filed.

For the record, this plugin follows a Gist Vojta started a while ago : https://gist.github.com/vojtajina/3354046.

Grunt to the rescue

Chech this Grunt task : grunt-angular-combine. This plugin was made especially for this need : producing the merged HTML file.

You'll find all the documention to use it on the grunt-angular-combine getting started page.

Release History

  • 0.1.0 : initial version
  • 0.1.1 : clean release process (no new feature)
  • v0.1.3 : release process is operational with good semserv versioning (no new feature)
  • v0.1.4 : distribution available withou console (smaller files) + compatibility for Angular > 1.3.6

Development

How to release

Before release, don't forget to do a full build !

The project use grunt-release for its versionning an tag process.

How to test

Tests in realtime into CLI :

grunt test

Tests into your browser :

grunt jasmine:test:build

Then, open the newly create file _SpecRunner.html into your browser.