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
}
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
}
}
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
);
Bugfixes and lots more
If you're curious then have a read through the release notes for the earlier beta and release candidate releases.