cerebral-view-angular2

Angular2 View layer package for Cerebral

Usage no npm install needed!

<script type="module">
  import cerebralViewAngular2 from 'https://cdn.skypack.dev/cerebral-view-angular2';
</script>

README

cerebral-view-angular2

Angular2 View layer package for Cerebral

The Cerebral Webpage is now launched

You can access the webpage at http://cerebraljs.com/

Debugger

You can download the Chrome debugger here.

Install

npm install cerebral-view-angular2

API

All examples are shown with Typescript syntax.

Render the app

// Your cerebral controller instance
import controller from './controller';
import {register} from 'cerebral-view-angular2';

// Your main application component
import AppComponent from './components/app.component';

// Register the controller with the decorator
register(controller);

// Bootstrap the angular2 app
document.addEventListener('DOMContentLoaded', () => {
  bootstrap(AppComponent)
    .catch(err => console.error(err));
});

Get state in components

Decorator

Use the decorator to pass state and signals to the component

import {Component} from 'angular2/core';
import {Decorator as Cerebral} from 'cerebral-view-angular2';

@Cerebral({
  isLoading: ['isLoading'],
  user: ['user'],
  error: ['error']  
})
class AppComponent {
  public signals;
  public state;
}

You can access your signals with:

this.signals.firstSignal();
this.signals.otherSignal();

You can access the state with:

this.state.isLoading;
this.state.user;
this.state.error;

Sample App

Running the TodoMVC Sample App

Clone the repo git clone https://github.com/cerebral/cerebral-view-angular2.git

Install dependencies npm install

Start the server. It will listen on localhost:3000 npm start