余烬简单身份验证登录错误未显示在页面上

Question

我正在关注一个在线视频教程，该教程设置了Ember Simple Auth Login。除了向模板显示登录错误(即 401 未经授权(之外，一切都有效。我已经检查了代码是否有拼写错误，但找不到任何拼写错误。

在控制器登录中，我尝试将e.errors记录到控制台，但控制台只显示"未定义"。但是，如果我只是将错误对象e发送到日志，那么我会得到带有error.detail的错误对象。注意：error.detail是我试图在login-form.hsb上显示的内容。

任何帮助不胜感激！

• 余烬 ： 3.4.5
• 余烬数据 ： 3.4.2
• j查询 ： 3.3.1
• 余烬简单身份验证：1.7.0

控制器/登录名.js

import { inject as service } from '@ember/service';
import Controller from '@ember/controller';
export default Controller.extend({
session: service('session'),
actions: {
login(attrs) {
this.get('session').authenticate('authenticator:jwt', {
email: attrs.email,
password: attrs.password
}).then(() => {
this.transitionToRoute('index');
}).catch((e) => {
this.set('errors', e.errors); // nothing is being displayed
console.log(e.errors); // Says Undefined in the console
console.log(e); // Display error to console
});
}
}
});

templates/login.hsb

{{login-form user=model errors=errors onsubmit=(action "login")}}

模板/组件/登录表单.hbs

<div class="slide-out">
<div class="slide-out-card">
<div class="slide-out-heading">
<div class="title">
<h3>Login</h3>
</div>
</div>
<div class="slide-out-content">
<form onsubmit={{action "login"}}>
<!-- this does not display the error message -->
{{#each errors as |error|}}
{{error.detail}}
<div class="error-alert">{{error.detail}}</div>
{{/each}}
<div class="field">
<label>Email:</label>
{{input type="text" placeholder="Email" value=email}}
</div>
<div class="field">
<label>Password:</label>
{{input type="password" placeholder="Password" value=password}}
</div>
<div class="form-footer">
<button type="submit" class="btn-submit">save</button>
</div>
</form>
</div>
</div>
</div>

Answer 1

答案来自Embercasts。简单身份验证中有一个重大更改。代码现在应该已e.json.errors

export default Controller.extend({
session: service('session'),
actions: {
login(attrs) {
this.get('session').authenticate('authenticator:jwt', {
email: attrs.email,
password: attrs.password
}).then(() => {
this.transitionToRoute('index');
}).catch((e) => {
this.set('errors', e.json.errors); // Breaking change to Simple Auth - should be e.json.errors, instead of e.errors
});
}
}
});