reduxjs · PatrickJS · Jul 8, 2015
diff --git a/examples/angular2-counter/.babelrc b/examples/angular2-counter/.babelrc
@@ -0,0 +1,3 @@
+{
+  "stage": 0
+}
diff --git a/examples/angular2-counter/actions/CounterActions.js b/examples/angular2-counter/actions/CounterActions.js
@@ -0,0 +1,33 @@
+import { INCREMENT_COUNTER, DECREMENT_COUNTER } from '../constants/ActionTypes';
+
+export function increment() {
+  return {
+    type: INCREMENT_COUNTER
+  };
+}
+
+export function decrement() {
+  return {
+    type: DECREMENT_COUNTER
+  };
+}
+
+export function incrementIfOdd() {
+  return (dispatch, getState) => {
+    const { counter } = getState();
+
+    if (counter % 2 === 0) {
+      return;
+    }
+
+    dispatch(increment());
+  };
+}
+
+export function incrementAsync() {
+  return dispatch => {
+    setTimeout(() => {
+      dispatch(increment());
+    }, 1000);
+  };
+}
diff --git a/examples/angular2-counter/components/Counter.ts b/examples/angular2-counter/components/Counter.ts
@@ -0,0 +1,23 @@
+import {Component, View, ON_PUSH} from 'angular2/angular2';
+
+@Component({
+  selector: 'counter',
+  changeDetection: ON_PUSH,
+  properties: ['counter', 'actions']
+})
+@View({
+  directives: [],
+  template: `
+  <p>
+    Clicked: {{ counter }} times
+    <button (^click)="actions.increment()">+</button>
+    <button (^click)="actions.decrement()">-</button>
+    <button (^click)="actions.incrementIfOdd()">Increment if odd</button>
+  </p>
+  `
+})
+export class Counter {
+  counter: number;
+  actions: any;
+  constructor() {}
+}
diff --git a/examples/angular2-counter/constants/ActionTypes.js b/examples/angular2-counter/constants/ActionTypes.js
@@ -0,0 +1,2 @@
+export const INCREMENT_COUNTER = 'INCREMENT_COUNTER';
+export const DECREMENT_COUNTER = 'DECREMENT_COUNTER';
diff --git a/examples/angular2-counter/containers/App.ts b/examples/angular2-counter/containers/App.ts
@@ -0,0 +1,20 @@
+import {Component, View} from 'angular2/angular2';
+import {createRedux} from 'redux';
+import * as stores from '../stores';
+import {CounterApp} from './CounterApp';
+
+@Component({
+  selector: 'root'
+})
+@View({
+  directives: [ CounterApp ],
+  template: `
+  <counter-app [redux]="redux"></counter-app>
+  `
+})
+export class App {
+  redux: any;
+  constructor() {
+    this.redux = createRedux(stores);
+  }
+}
diff --git a/examples/angular2-counter/containers/CounterApp.ts b/examples/angular2-counter/containers/CounterApp.ts
@@ -0,0 +1,36 @@
+import {Component, View, onInit, onDestroy} from 'angular2/angular2';
+import {bindActionCreators} from 'redux';
+import {Counter} from '../components/Counter';
+import * as CounterActions from '../actions/CounterActions';
+
+@Component({
+  selector: 'counter-app',
+  lifecycle: [onInit, onDestroy],
+  properties: ['redux']
+})
+@View({
+  directives: [ Counter ],
+  template: `
+  <counter [counter]="state.counter" [actions]="actions"></counter>
+  `
+})
+export class CounterApp {
+  state: any;
+  redux: any;
+  actions: any;
+  unsubscribe: Function;
+  constructor() {
+  }
+  onInit() {
+    const handleChange = this.handleChange.bind(this);
+    this.unsubscribe = this.redux.subscribe(handleChange);
+    handleChange();
+  }
+  handleChange() {
+    this.state = this.redux.getState();
+    this.actions = bindActionCreators(CounterActions, this.redux.dispatch);
+  }
+  onDestroy() {
+    this.unsubscribe();
+  }
+}
diff --git a/examples/angular2-counter/index.html b/examples/angular2-counter/index.html
@@ -0,0 +1,12 @@
+<html>
+  <head>
+    <title>Redux Angular 2 Counter Example</title>
+    <link rel="icon" href="data:;base64,iVBORw0KGgo=">
+    <!-- ES6 polyfills -->
+    <script src="https://cdn.rawgit.com/jmcriffey/bower-traceur-runtime/master/traceur-runtime.min.js"></script>
+  </head>
+  <body>
+    <root></root>
+  </body>
+  <script src="/static/bundle.js"></script>
+</html>
diff --git a/examples/angular2-counter/index.ts b/examples/angular2-counter/index.ts
@@ -0,0 +1,7 @@
+import {bootstrap} from 'angular2/angular2';
+import {App} from './containers/App';
+
+bootstrap(
+  App,
+  [] // di bindings
+);
diff --git a/examples/angular2-counter/package.json b/examples/angular2-counter/package.json
@@ -0,0 +1,47 @@
+{
+  "name": "counter-redux",
+  "version": "0.0.0",
+  "description": "Counter example for redux",
+  "main": "server.js",
+  "scripts": {
+    "start": "node server.js"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/gaearon/redux.git"
+  },
+  "keywords": [
+    "react",
+    "reactjs",
+    "hot",
+    "reload",
+    "hmr",
+    "live",
+    "edit",
+    "webpack",
+    "flux"
+  ],
+  "license": "MIT",
+  "bugs": {
+    "url": "https://github.com/gaearon/redux/issues"
+  },
+  "homepage": "https://github.com/gaearon/redux#readme",
+  "dependencies": {
+    "angular2": "2.0.0-alpha.30",
+    "rtts_assert": "2.0.0-alpha.30",
+    "react": "^0.13.3",
+    "redux": "^0.12.0",
+    "reflect-metadata": "^0.1.0",
+    "zone.js": "^0.5.2"
+  },
+  "devDependencies": {
+    "typescript": "git://github.com/Microsoft/TypeScript.git#release-1.5",
+    "typescript-simple-loader": "^0.2.0",
+    "babel-core": "^5.5.8",
+    "babel-loader": "^5.1.4",
+    "node-libs-browser": "^0.5.2",
+    "react-hot-loader": "^1.2.7",
+    "webpack": "^1.9.11",
+    "webpack-dev-server": "^1.9.0"
+  }
+}
diff --git a/examples/angular2-counter/server.js b/examples/angular2-counter/server.js
@@ -0,0 +1,17 @@
+var webpack = require('webpack');
+var WebpackDevServer = require('webpack-dev-server');
+var config = require('./webpack.config');
+
+new WebpackDevServer(webpack(config), {
+  publicPath: config.output.publicPath,
+  hot: true,
+  historyApiFallback: true,
+  stats: {
+    colors: true
+  }
+})
+.listen(3000, 'localhost', function (err) {
+  if (err) { console.log(err); }
+
+  console.log('Listening at localhost:3000');
+});
diff --git a/examples/angular2-counter/stores/counter.js b/examples/angular2-counter/stores/counter.js
@@ -0,0 +1,12 @@
+import { INCREMENT_COUNTER, DECREMENT_COUNTER } from '../constants/ActionTypes';
+
+export default function counter(state = 0, action) {
+  switch (action.type) {
+  case INCREMENT_COUNTER:
+    return state + 1;
+  case DECREMENT_COUNTER:
+    return state - 1;
+  default:
+    return state;
+  }
+}
diff --git a/examples/angular2-counter/stores/index.js b/examples/angular2-counter/stores/index.js
@@ -0,0 +1 @@
+export { default as counter } from './counter';
diff --git a/examples/angular2-counter/tsconfig.json b/examples/angular2-counter/tsconfig.json
@@ -0,0 +1,23 @@
+{
+  "version": "1.5.0",
+  "compilerOptions": {
+    "target": "es5",
+    "module": "commonjs",
+    "declaration": false,
+    "noImplicitAny": false,
+    "removeComments": true,
+    "noLib": false,
+    "emitDecoratorMetadata": true,
+    "experimentalDecorators": true,
+    "sourceMap": true,
+    "listFiles": true,
+    "outDir": "dist"
+  },
+  "files": [
+    "./node_modules/typescript/bin/lib.dom.d.ts",
+    "./typings/_custom/custom.d.ts",
+    "./typings/tsd.d.ts",
+    "./containers/App.ts",
+    "./bootstrap.ts"
+  ]
+}
diff --git a/examples/angular2-counter/tsd.json b/examples/angular2-counter/tsd.json
@@ -0,0 +1,21 @@
+{
+  "version": "v4",
+  "repo": "borisyankov/DefinitelyTyped",
+  "ref": "master",
+  "path": "typings",
+  "bundle": "typings/tsd.d.ts",
+  "installed": {
+    "angular2/angular2.d.ts": {
+      "commit": "8ebc099072402b1a80d205c3eece59bed963ad87"
+    },
+    "rx/rx.d.ts": {
+      "commit": "8c7444882a2bc2ab87387f8f736a7d97e89b9c90"
+    },
+    "rx/rx-lite.d.ts": {
+      "commit": "8c7444882a2bc2ab87387f8f736a7d97e89b9c90"
+    },
+    "es6-promise/es6-promise.d.ts": {
+      "commit": "8c7444882a2bc2ab87387f8f736a7d97e89b9c90"
+    }
+  }
+}
diff --git a/examples/angular2-counter/typings/_custom/browser.d.ts b/examples/angular2-counter/typings/_custom/browser.d.ts
@@ -0,0 +1,4 @@
+interface ObjectConstructor {
+    assign(target: any, ...sources: any[]): any;
+    observe(target: any, callback: Function, acceptList?: Array<any>): void;
+}
diff --git a/examples/angular2-counter/typings/_custom/custom.d.ts b/examples/angular2-counter/typings/_custom/custom.d.ts
@@ -0,0 +1,3 @@
+/// <reference path="browser.d.ts" />
+/// <reference path="ng2.d.ts" />
+/// <reference path="webpack.d.ts" />
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,2 @@
		export const INCREMENT_COUNTER = 'INCREMENT_COUNTER';
		export const DECREMENT_COUNTER = 'DECREMENT_COUNTER';
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1 @@
		export { default as counter } from './counter';