ng-harmony-iocdeprecated

An AppManager for ng-harmony angular apps

Usage no npm install needed!

<script type="module">
  import ngHarmonyIoc from 'https://cdn.skypack.dev/ng-harmony-ioc';
</script>

README

Ng-harmony-ioc

=========================

Join the chat at https://gitter.im/ng-harmony/ng-harmony

Concept

An AppManager for ng-harmony angular apps

Use it in conjunction with

  • literate-programming to write markdown-flavored literate JS, HTML and CSS
  • jspm for a nice solution to handle npm-modules with ES6-Module-Format-Loading ...

Files

This serves as literate-programming compiler-directive

./dist/raw/ng_harmony.js

Compilation

Dependency Imports

    import angular from "angular";
    import router from "angular-ui-router";
    import { Ctrl } from "ng-harmony";

The Module klass serves as little convenience wrapper so one can write tastier code

    class Module {
        constructor() {}
        static init(name, dependencies) {
            this.name = name;
            this.dependencies = dependencies;
            this.module = angular.module(name, dependencies);
        }
        static routing(routes) {
            this.routes = routes;
            this.module.config(($stateProvider, $urlRouterProvider) => {
                if (typeof routes.default !== "undefined" && routes.default !== null) {
                    $urlRouterProvider.otherwise(routes.default);
                }
                for (let [i, state] of routes.entries()) {
                    let resolve = {};
                    if (typeof state.config.resolve !== "undefined" && state.config.resolve !== null) {
                        for (let [injectee, stateParam] of this.iterate(state.config.resolve)) {
                            resolve[injectee] = ["$stateParams", ($params) => {
                                return $params[stateParam];
                            }];
                        }
                    }
                    state.config.resolve = resolve;
                    let config = state.config;
                    $stateProvider.state(state.name, state.config);
                }
            });
        }
        static config(foo) {
            if (typeof this.module === "undefinded" || this.module === null) {
                throw "Cannot access module: undefined!";
            }
            this.module.config(foo);
        }
    }

The StateCtrl is a very basic Event-Handler that serves as Route-Ctrl for handling state-inter-dependencies of the routes' subsequent components ...

    class StateCtrl extends Ctrl {
        constructor(...args) {
            super(...args);
            this.$scope.$on("stateRequest", (component, state, mode, ...args) => {
                this.broadcast(component, state, mode, ...args);
            });
        }
        broadcast(component, state, mode, ...args) {
            this.$scope.$broadcast(`${component}::${state}::${mode}`, ...args);
        }
    }

USAGE

Please create a dedicated json file for the routing of each of your features/modules. Then kick off the module using the Module-klass's static methods.

Example JSON Routing-File:

[
    {
        "name": "stateName",
        "config": {
            "url": "/url/:path/:id",
            "controller": "MyController",
            "templateUrl": "/path/to/template",
            "resolve": {
                "selection": "path",
                "id": "id"
            }
        }
    }
]

CHANGELOG

0.1.0: Initial Features: Basic Module creation and routing using ui-router, convenience config accessor + Basic Statemachine