emberjs-1.0.0-rc-6.1
My controller :
Application.LoginController = Ember.Controller.extend({
loginFailed: false,
isProcessing: false,
isSlowConnection: false,
timeout: null,
login: function() {
/* some code */
},
success: function() {
this.reset();
},
failure: function() {
this.reset();
},
reset: function() {
clearTimeout(this.get("timeout"));
this.setProperties({
isProcessing: false,
isSlowConnection: false
});
}
});
My Routing :
Application.LoginRoute = Ember.Route.extend({
setupController: function(controller, model) {
controller.reset();
},
events: {
}
});
When I go to "/login" for the first time, setupController is called. However, I would like to use a event (like transition) to call controller.reset() everytime Application transition into login.
With
LOG_TRANSITIONS: true
I can see "Transitionned into 'login'", "Transitionned into 'anotherPage'" in the console, so I would like to know if it's possible to get the event which trigger those logs, in my router.
Like :
Application.LoginRoute = Ember.Route.extend({
setupController: function(controller, model) {
controller.reset();
},
events: {
didTransition: function(reason) {
controller.reset();
}
}
});
I would like to know if it's possible to get the event which trigger those logs, in my router.
You can hook into to the route's activate and deactivate hooks and call the controller methods from there, like this:
Application.LoginRoute = Ember.Route.extend({
activate: function() {
this.controllerFor('login').send('reset');
},
deactivate: function() {
this.controllerFor('login').send('reset');
}
});
Hope it helps.
Related
Given the following code, how can the route call it's doSomething action?
export default Ember.Route.extend({
setupController: function(controller, model) {
// call the doSomething action
},
actions: {
doSomething: function() { ... }
}
}
You can use Transition object which is passed do beforeModel/model/afterModel hook.
App.IndexRoute = Ember.Route.extend({
actions: {
doSomething() {
console.log('doSomethingInvoked');
}
},
beforeModel(transition) {
transition.send('doSomething');
},
model(params, transition) {
transition.send('doSomething');
},
afterModel(model, transition) {
transition.send('doSomething');
}
});
Working demo.
I set an observer function for a model's attribute in a controller.
and It fires as soon as I enter the route for that controller.
And I know it's because of controller.set('model', model); in setupController. How can I prevent this?
I want to use observer to make another attribute changed when an attribute is changed.
But because of this behavior my logic leads to a bug.....
Route
MuteAdmin.NewRoute = Ember.Route.extend({
model: function() {
return this.store.createRecord(this.get('articleModelClassName'));
},
setupController: function(controller, model) {
controller.set('model', model);
this.store.find(this.get('categoryModelClassName')).then(function(categories) {
controller.set('categories', categories);
if (model.get('category') == null) {
model.set('category', categories.get('firstObject'));
};
}.bind(this));
},
deactivate: function() {
if(this.controller.get('isDirty')) this.controller.get('model').deleteRecord();
}
});
Controller
MuteAdmin.NewController = Ember.ObjectController.extend(MuteAdmin.Modelable, {
publicChanged: function() {
console.log('How can I prevent this from printing when entering its route?');
}.observes('public'),
actions: {
submit: function() {
var currentUser = this.get('currentUser');
var article = this.get('model');
article.set('author', currentUser);
article.save().then(function() {
this.set("flashSuccess", "Successfully Created.");
this.transitionToRoute('index');
}.bind(this), function() {
});
}
}
});
Probably not the Ember way, but when I needed to manipulate model and controller on setup I used a flag to indicate controller is setting up.
Something like this:
MyRoute = ProtectedRoute.extend({
setupController: function (controller, model) {
controller['settingController'] = true;
controller.setProperties({
'prop1Name' : val1,
'prop2Name': val2,
'propNName': valN
});
controller['settingController'] = false;
// Call _super for default behavior
this._super(controller, model);
}
});
MyController = Ember.ObjectController.extend({
anAfterChangeObserver: function() {
if(controller['settingController']){
return;
}
doSomethings();
}.observes('prop1Name')
});
In soume routes in my app error action is never triggered and I can't figure out why. On some Routes error action works fine.
This is application route:
Simitu.ApplicationRoute = Ember.Route.extend({
init: function() {
this._super();
Simitu.AuthManager = Simitu.AuthManager.create();
},
model: function() {
if (Simitu.AuthManager.get('session.user'))
return this.store.find('admin', Simitu.AuthManager.get('session.user'));
},
actions: {
error: function(reason, transition) {
if (reason.status === 401) {
Simitu.AuthManager.reset();
this.transitionTo('login');
}
}
}
});
On this route Error is never triggered:
Simitu.PlacesIndexRoute = Ember.Route.extend({
model: function() {
var self = this;
// force adapter request
this.store.find('place');
return this.store.filter('place', function(record) {
// return just places that belongs to this client / application
return record.get('client_id') === self.modelFor('client');
});
},
actions: {
createNew: function() {
var place = this.store.createRecord('place');
// tree structure in places is not implemented yet
//parent = this.store.find('place', params.place_id);
place.set('client_id', this.modelFor('client'));
// open place
this.transitionTo('place', place);
},
error: function(error, transition) {
return true;
}
}
});
And on this Route everything works just fine:
Simitu.ClientsRoute = Ember.Route.extend({
model: function() {
return this.store.find('client');
},
actions: {
error: function() {
return true;
}
}
});
Have anybody some ide why?
The error action is fired on the resource, not an individual route.
http://emberjs.jsbin.com/cayidiwa/1/edit
This is how my router looks like. Maybe it breaks because of the nesting or filter logic in models. I fixed it in beforeModel hook in routes but still have not clue what is wrong with my first solution.
Simitu.Router.map(function () {
this.resource('login');
this.resource('clients');
this.resource('client', { path: 'clients/:client_id'}, function() {
this.resource('places', function() {
this.resource('place', { path: ':place_id' });
});
this.resource('placecategories',{ path: 'places-categories' }, function() {
this.route('new');
});
});
});
I move some of auth handling logic to beforeModel hook.
Simitu.AuthRoute = Ember.Route.extend({
beforeModel: function(transition) {
if (!Simitu.AuthManager.isAutenticated()) {
this.redirectToLogin(transition);
}
},
redirectToLogin: function(transition) {
this.transitionTo('login');
},
actions: {
error: function(reason, transition) {
if (reason.status === 401) {
Simitu.AuthManager.reset();
this.redirectToLogin(transoition);
}
}
}
});
How can I do a get('transaction').rollback() or deleteRecord() of the model in the deactivate route hook when the model is isNew? I can't figure out how to access the model from within the hook.
app.js
App.Router.map(function() {
this.resource('users', function() {
this.route('new');
})
});
App.UsersNewRoute = Ember.Route.extend({
model: function() {
return App.User.createRecord();
},
activate: function() {
this.controllerFor('users').set('newUserCreate', true);
},
deactivate: function() {
this.controllerFor('users').set('newUserCreate', false);
}
});
This is the code that does a rollback() on the model:
deactivate: function() {
this.controllerFor('users').set('newUserCreate', false);
if (this.currentModel.get('isNew')) {
this.currentModel.get('transaction').rollback();
}
Special thanks to #sly7_7 for solving this.
Route objects know about their controllers. You should also be able to do this:
deactivate: function() {
var model = this.get('controller.content');
if (model.get('isNew')) {
model.deleteRecord();
};
};
I have code such as that shown below, and I'm just wondering how I can trigger another event within the route's events. Thoughts?
App.MyRoute = Ember.Route.extend({
events: {
eventOne: function() {
// do something
},
eventTwo: function() {
// how do I call eventOne() here?
},
}
});
You can just call events.eventOne() using this as the context:
App.IndexRoute = Ember.Route.extend({
events: {
eventOne: function() {
console.log('You got me!');
},
eventTwo: function() {
this.events.eventOne();
},
}
});