Status
Tested and debugged. Will consider it a beta-software from now on. Using it in the wild on the github.io-todomvc-demo of this repo.
Synopsis
Base Classes for all ng-harmony-modules. Ng-Harmony is a collection of modules that allow for unique Angular-Codestyle, eg. Classes in Angular 1
Code Example
;;
We can mixin some of our own class-methods via mixin
Be sure to call the super constructor before you do your important stuff. The super-constructor does initialization like creating the dependency injected accessors/member vars and bind $-prefixed methods to this.$scope
.
{ super...args; thisdataInterval = this; } { if thisMyListServicestatus === true this$interval; this$scopedata = thisMyListServicedata; this; }
If you want your method to be exposed in $scope, you need to prefix the method-name with $
this$location; }
Dependency Injection works via a static setter ... You can pass a single dependency as a string, or multiple as an Array of strings.
ListController$inject = "$location" "$interval" "MyListService";
We need to register our class with angular. The passing in of a type with extending Controller is unnecessary/optional, since controller is unambiguous. It's different with Services, since there is angular.service
, angular.factory
...
ListController$register = "myModule": type: "controller" name: "ListController" ;
Now let's create our View/Template
ul li(ng-repeat="item in data") a(ng-click="href($index)") {{item.name}}
Now let's create a small service to serve the list-api-data to whichever controller needs it
{ super...args; thisapiUrl = "/api/listItems"; this; } { $http; } { thisdata = responsedata || ; thisstatus = responsestatus; } { thisstatus = responsestatus; } { return this_status == "200"; } { this_status = status; }MyListService$register = "myModule": type: "service" name: "MyListService"
Motivation
- I wanted to code OOP with Angular
- I wanted to be able to reuse my classes as in creating whole libs
- I wanted a place that might become a community project
- I didn't want to wait on Angular 2
Installation
I recommend the usage of jspm. This way, just base your project upon jspm and start using this lib as in the code example above.
jspm i github:ng-harmony/ng-harmony
API Reference
Harmony
(Root-Class)
static $inject
: Dependency injection
static $register
: Register the class with a module
iterate
: Iterate with for .. of over { objs }
static iterate
: Iterate with for .. of over { objs }
static mixin
: mixin Utility classes
toString
: access the Class-Name inside an instance
Controller
digest
: manually trigger an angular digest-cycle
Contributors
Drop me an email at johannes.neugschwentner at gmail dot com
License
MIT