Angularjs view for Cerebral.
npm install @cerebral/angularjs angular
import angular from 'angular'
import { addModule, connect } from '@cerebral/angularjs'
import App from 'cerebral'
addModule(angular)
const mainModule = Module({
state: {
foo: 'bar'
},
sequences: {
onClick: []
},
services: ['MyAngularService'] // main module only. Added as providers with same name
})
const app = App(mainModule)
angular.module('app', ['cerebral'])
.config(function (cerebralProvider) {
cerebralProvider.configure(app)
})
...
import angular from 'angular'
import { addModule, connect } from '@cerebral/angularjs'
import { state, sequences } from 'cerebral'
angular.module('app', ['cerebral'])
.config(...)
.component('myComponent', {
template: '<div ng-click="$ctrl.click()">{{$ctrl.foo}}</div>',
controller: connect({
foo: state`foo`,
click: sequences`onClick`
}, 'MyComponent', ['cerebral', function MyController (cerebral) {
// In some cases you might need access to the cerebral app.
// You can inject the cerebral angular service and
// access it's app property anywhere in your app
cerebral.app.getSequence('mySignal')()
// Optionally add custom behaviour to app
}])
})
Since angular doesn’t expose the component name,
you will need to provide one to connect
for the
component to be given a name in cerebral.
You can call connect in the following ways:
connect(dependencies)
connect(dependencies, name)
connect(dependencies, controller)
connect(dependencies, name, controller)