1.3にBrowserify組み合わせて イベント駆動にした話

ng-japan March 21, 2015

@armorik83

• 京都から来ました from Kyoto.

• AngularJS Anti-patternsアンチパターン集

• Modern AngularJSetc.

1.4.0-beta.5

1.3.12 by own project

var angular = require('angular'); console.log(angular.version);

var angular = require('angular'); console.log(angular.version);

1.4.0-beta.5

^1.3.14 2015-02-24

！！？？

Already supported

• 1.3でBrowserify使った話しようと思ったら、もう対応してました👍

• browserify-shim is useful when you use <=1.3.13thlorenz/browserify-shim

Use only directive

• Each .ts file has one directive

• Towards 2.0, I DON'T use service, factory, ng-controller

Isolate Scope & broadcast

• Use only Directive's isolate scope

• Use only $broadcast()

• But event names scatteredイベント名文字列が散らばる…

Add Listenerimport Store = require('./store'); class DirectiveController { constructor() { Store.addListener(this.someMethod); } } !class Store { addListener(listener) { this.$rootScope.$on(EVENT_NAME, listener); } ! hasChanged(err) { this.$rootScope.$broadcast(EVENT_NAME, err); } }

Gather into one class ✌️

Respect for F...

• An Architecture F...Action -> Dispatcher -> Store -> View

• My Angular 1.3 ProjectChild Directive Controller -> Dispatcher -> Store -> Root Directive

• Without ng-controller, Angular DI, service, factory. Browserify is helpful us.

Find more on GitHub https://github.com/armorik83/interactive-sem/tree/latent-variable

Thanks a lot!