What's new in Classy 1.0?

Plugins

This is the headline feature! Angular Classy now supports plugins so you can extend Classy with useful features like mixins and computed properties.

If you want to write your own plugins then head on over to the classy-plugins repo for more information. This will be expanded with more detail over time, if you have a question then raise an issue.

It's early days but you can view a list of the current Classy plugins on the Classy homepage.


More Structure

Data

There is now a data property available for defining initial data properties. This will enable you to remove a lot of boilerplate assignment out of your init method.

There are two ways to use the data property. You can either use an object which allows you to use the full power of Angular expressions when defining data properties.

data: {
  todos: 'todoStorage.get()',
  editedTodo: null
}
data:
  todos: 'todoStorage.get()'
  editedTodo: null

Or, if you prefer you can use a function that returns an object, this allows you to reference other class properties directly (rather than through an angular expression).

data: function() {
  return {
    todos: this.todoStorage.get(),
    editedTodo: null
  }
}
data: ->
  todos: this.todoStorage.get()
  editedTodo: null

Methods

Controller methods work just as before (pre-1.0) but they are now defined within the methods property. This is a small bit more verbose but it provides a clearer structure and avoids confusion with Classy properties (name/inject/data/init/watch) and any future properties which will be used by Classy plugins.

Method Expression

You can now define methods using angular expressions. Whenever the method is called it will evaluate the expression and return the expression's result. Often, an expression will be much more concise and readable than a full method definition.

methods: {
  getLast5CompletedTodos: 'todos | filter:{completed: true} | orderBy:"timestamp" | limitTo:5'
}

Multiple controllers definition and chaining

Earlier versions of Angular Classy didn't allow chaining (of services, routes and factories etc.) with Classy controllers. This was done to allow you to use Classy controllers inline with directives.

We are maintaining support for directives but also introducing a new syntax: classy.controllers (notice the 's' at the end) that takes an array of controllers and supports chaining so now you can do:

angular.module('app', ['classy'])
  .classy.controllers([{
    name: 'BarController',
    inject: ['$scope'],
    init: function() {
      this.$.foo = 'bar';
    }
  }, {
    name: 'BazController',
    inject: ['$scope'],
    init: function() {
      this.$.foo = 'baz';
    }
  }])
  .service(
    // Service here
  )
  .config(
    // Config here
  );
angular.module("app", [ "classy" ])
  .classy.controllers([
    name: "BarController"
    inject: [ "$scope" ]
    init: -> @$.foo = "bar"
  ,
    name: "BazController"
    inject: [ "$scope" ]
    init: -> @$.foo = "baz"
  ]).service(
    # Service here
  ).config(
    # Config here
  )

Bugfixes and lots more

If you're curious then have a read through the release notes for the earlier beta and release candidate releases.