r4bbit 0x-r4bbit

Angular module structure (proposal)

Everyone who's reading this, please leave your opinion/ideas/proposals as a comment for a better world!

Background

Most of you guys read Josh' proposals to make components more reusable, I think. Now, reading through this proposals definitely gives a feeling that this is the right way. Anyways, If you haven't read it yet, you should.

So Josh shows us, how angular apps can be structured in a better and more reusable way. Reusability is a very important thing when it comes to software development. Actually the whole angularjs library follows a philosophy of reusability. Which is why you able to make things like:

	var promiseToWaitFor = (function () {$
	var promise = $preferredLanguage ?$
	langPromises[$preferredLanguage] :$
	langPromises[$uses];$
	$
	if (!promise) {$
	promise = langPromises[Storage.get($storageKey)];$
	}$
	return promise;$
	}());

	describe('useLocalStorage()', function () {

	beforeEach(module('pascalprecht.translate', 'ngCookies', function ($translateProvider) {
	// ensure that the local storage is cleared.
	window.localStorage.clear();
	$translateProvider.translations('de_DE', {
	'EXISTING_TRANSLATION_ID': 'foo',
	'ANOTHER_ONE': 'bar',
	'TRANSLATION_ID': 'Lorem Ipsum {{value}}',
	'TRANSLATION_ID_2': 'Lorem Ipsum {{value}} + {{value}}',

	angular.module('services.breadcrumbs', []);

	angular.module('services.breadcrumbs').factory('breadcrumbs', ['$rootScope', '$location', function ($rootScope, $location) {

	var breadcrumbs = [];
	var breadcrumbsService = {};

	$rootScope.$on('$routeChangeSuccess', function (event, current) {
	var pathElements = $location.path().split('/'), result = [], i;

	'use strict';

	myApp.directive('zippy', function(){
	return {
	restrict: 'E',
	transclude: true,
	scope: { title:'@title' },
	template:
	'<div class="zippy {{state}}">' +
	'<div class="title" ng-click="toggle()">{{title}}</div>' +