0
我創建了一個小的jsfiddle,它不使用ember 1.5和handlebars 1.3執行登錄權限。登錄控制器擁有設置爲true的屬性「isLogin」。但爲什麼事後沒有其他路線和模板注意到這種變化?Ember控制器似乎在模板和路由中創建了多個實例?
<script type="text/x-handlebars">
{{#if controllers.login.isLogin}}
<div class="container">
<div class="navbar">
<div class="navbar-inner">
<a class="brand" href="#">Ember Digest</a>
<ul class="nav pull-right">
<li>{{#link-to 'articles'}}Articles{{/link-to}}</li>
<li>{{#link-to 'photos'}}Photos{{/link-to}}</li>
<li>{{#link-to 'login'}}Login{{/link-to}}</li>
</ul>
</div>
</div>
{{outlet}}
</div>
{{/if}}
{{render 'login' controllers.login.content}}
</script>
<script type="text/x-handlebars" data-template-name="articles">
<h2>Articles</h2>
</script>
<script type="text/x-handlebars" data-template-name="login">
{{#if isLogin}}
<p>You are already logged in!</p>
{{else}}
<form class="form-inline" {{action login on="submit"}}>
<h2>Log In</h2>
{{input class="btn" type="submit" value="Log In"}}
</form>
{{#if errorMessage}}
<div class="alert alert-error">{{errorMessage}}</div>
{{/if}}
{{/if}}
</script>
和JS
App = Ember.Application.create();
// Routes
App.Router.map(function() {
this.route('articles');
this.route('photos');
this.route('login');
});
App.LoginRoute = Ember.Route.extend({
renderTemplate: function() {
this.render('login', {
into: 'application',
outlet: 'login'
});
}
});
App.AuthenticatedRoute = Ember.Route.extend({
beforeModel: function (transition) {
if (!this.controllerFor('login').get('isLogin')) {
this.redirectToLogin(transition);
}
},
redirectToLogin: function (transition) {
alert('You must log in!');
var loginController = this.controllerFor('login');
loginController.set('errorMessage', 'Login first');
this.transitionTo('login');
}
});
App.ApplicationRoute = Ember.Route.extend({
beforeModel: function (transition) {
if (!this.controllerFor('login').get('isLogin')) {
this.transitionTo('login');
}
}
});
App.LoginController = Ember.Controller.extend({
isLogin: false,
errorMessage: '',
actions: {
login: function() {
alert("login");
this.set('isLogin', true);
this.transitionToRoute('articles');
}
}
});
App.ArticlesRoute = App.AuthenticatedRoute.extend({
needs: 'login'
});
App.ApplicationController = Ember.Controller.extend({
needs : 'login'
});
謝謝你給這裏面。這很容易計算,但爲了完整起見:您的第二個控制器應該命名爲「LoginController」。 – justastefan