使用 Ember 2.x 从 Auth0/facebook JSON 响应中获取数据

Getting data from Auth0/facebook JSON response with Ember 2.x

我设置了来自 Auth0 的启动种子,它有效,并给出以下(片段)json 字符串:

          {
"name": "Silvio Langereis",
 "given_name": "Silvio",
 "family_name": "Langereis",
 "gender": "male",
...

在我的 main-profile.hbs 中,我有以下来自 Auth0 的预设代码,它显示相应的项目:

 <h3>{{profile.name}}</h3>
<h4>{{profile.nickname}}</h4>

然后完整的 json 字符串显示为 profile.body

当我想显示 {{profile.given_name}} 时,什么也没有显示。对此我有点不解。 profile.name 在 json 中就在它的正上方并且显示得很好。 任何人都知道这里发生了什么?思路是将已经获取的数据填入一个表单中,让用户在第一次登录时完成并提交(从而形成一个db记录)。

这工作正常,文本字段填写:

    <div class="form-group has-feedback {{if item.isValidUserName 'has-success'}}">
        <label class="col-sm-2 control-label">Gebruikersnaam*</label>
        <div class="col-sm-7 col-sm-offset-1">
            {{input type="text" value=profile.name class="form-control"}}
            {{#if item.isValidUserName}}<span class="glyphicon glyphicon-ok form-control-feedback"></span>{{/if}}
        </div>
    </div>

这不是:

<div class="form-group">
    <label class="col-sm-2 control-label">Voornaam*</label>
    <div class="col-sm-7 col-sm-offset-1">
        {{input type="text" value=profile.given_name class="form-control"}}
        {{#if item.isValidFirstName}}<span class="glyphicon glyphicon-ok form-control-feedback"></span>{{/if}}
    </div>
</div>

我真是个笨蛋!

在 routes/user-profile.js 中,json 被解析并添加到本地存储对象 'profile'。在那里我必须声明我想要放入其中的值。

routes/user-profile.js:

import Ember from 'ember';
import AuthenticatedRouteMixin from 'ember-simple-auth/mixins/authenticated-route-mixin';

export default Ember.Route.extend({
  model() {
    const profile = localStorage.getItem('profile');
    const profileObject = JSON.parse(profile);
    const model = {
      name: profileObject.name,
      nickname: profileObject.nickname,
      pictureUrl: profileObject.picture,
      email: profileObject.email,
      body: profile.trim()
    };
    return model;
  }
});

添加以下行,解决问题:given_name: profileObject.given_name,

冲洗并重复所需的值。