Not able to filter the model using the Ember.Select in Ember.js

Not able to filter the model using the Ember.Select in Ember.js

The use case is I am trying to filter the model using the Ember.Select,
whenever the user clicks the button, the model gets filtered on the basis
of the 'Designation' property.
Here's my Ember.Select:
{{view Ember.Select
contentBinding="designations"
optionValuePath="content.id"
optionLabelPath="content.designation"
selectionBinding="roles.selectedDesignation"}}
<button {{action 'filter'}}>Filter</button>
And Here's what I am doing in App.js,
App.TwodController = Ember.Controller.extend({
filteredContent : Ember.computed.oneWay("content"),
selectedDesignation : null,
designations : [{
designation : "Design",
id : 1
}, {
designation : "Writer",
id : 2
}],
actions : {
filter : function() {
var designation = this.get('roles.selectedDesignation');
var filtered =
this.get('content').filterProperty('designation',
designation);
this.set("filteredContent", filtered);
}
}
});
Here's the full JSBin, http://jsbin.com/IkiVIJU/1/
What I might be missing here?