Ember.js查找从webapi控制器返回的第一个数据属性的模型

时间:2014-08-14 10:15:59

标签: c# javascript asp.net ember.js asp.net-web-api

任何人都可以解决这个问题,这个问题一直困扰着几个小时,这将是很棒的......

我是ember.js的新手,我正试图通过以下方式将用户模型加载到我的应用程序的全局范围内:

(安装程序基于this template并使用webapi_adapter和序列化程序。)

据我所知,我需要使用以下内容:

ApplicationController.js

App.ApplicationController = Em.ObjectController.extend({
    hasError: function () {
        var currentError = this.get("error");
        return !(currentError === '' || currentError === null);
    }.property('error'),
});

user.js的

var attr = DS.attr;
App.User = DS.Model.extend({
    email: attr('string'),
    accountId: attr('string'),
    firstName: attr('string'),
    lastName: attr('string'),
});

App.UserSerializer = DS.WebAPISerializer.extend({
    primaryKey: 'email',

    normalizeHash: {
        user: function (hash) {
            hash.email = hash.email;
            return hash;
        },
    }
});

ApplicationRoute.js

App.ApplicationRoute = Ember.Route.extend({
    model: function() {
        return this.store.find('user');
    },
});

UserController.cs

//GET api/user
        public object GetCurrentUser()
        {
            var u = AuthenticatedUser;
            return new UserDto(u);
        }

UserDto.cs

public class UserDto
{
    public UserDto() { }

    public UserDto(User user)
    {
        Email = user.Email;
        FirstName = user.FirstName;
        LastName = user.LastName;
        AccountId = user.AccountId;
    }

    [Key]
    public string Email { get; set; }

    public string FirstName { get; set; }

    public string LastName { get; set; }

    public string AccountId { get; set; }

}

我遇到的问题是我收到了错误

Error while processing route: index No model was found for 'email' Error: No model was found for 'email'

其中email是用户数据中返回的第一个json属性,即:

{"Email":"johnsmith@test.com","FirstName":"John","LastName":"Smith","AccountId":"AccountJS"}

任何想法我做错了什么?

供参考:

router.js

App.Router.map(function () {
    this.route("index", { path: "/" });
});

2 个答案:

答案 0 :(得分:1)

我做了以下显示用户列表,您可以将其用作参考:

应用\控制器\ UserListsController.js

App.UserListsController = Ember.ArrayController.extend({
    error: ""
});

应用\模型\ UserList.js

var attr = DS.attr;

App.UserList = DS.Model.extend({
    email: attr('string'),
    accountId: attr('string'),
    firstName: attr('string'),
    lastName: attr('string'),
});

App.UserListSerializer = DS.RESTSerializer.extend({
    primaryKey: 'email',

    //// ember-data-1.0.0-beta2 does not handle embedded data like they once did in 0.13, so we've to update individually if present
    //// once embedded is implemented in future release, we'll move this back to WebAPISerializer.
    //// see https://github.com/emberjs/data/blob/master/TRANSITION.md for details
    extractArray: function (store, primaryType, payload) {
        var primaryTypeName = primaryType.typeKey;

        var typeName = primaryTypeName,
            type = store.modelFor(typeName);

        var data = {};
        data[typeName] = payload;
        payload = data;
        return this._super.apply(this, arguments);
    },

    normalizeHash: {
        userList: function (hash) {
            hash.email = hash.id;
            return hash;
        }
    }

});

App \ routes \ TodoListRoute.js,添加

App.UserListsRoute = Ember.Route.extend({
    model: function () {
        return this.store.find('userList');
    },
});

App \ templates_navbar.hbs,添加

<li>
    {{#linkTo 'userLists'}}
      userList
    {{/linkTo}}
</li>

应用\模板\ userLists.hbs

<h2>Users</h2>

<section id="lists">
    {{#each controller}}
    <article class="todoList">
        <p>{{email}}</p>
        <p>{{firstName}}</p>
        <p>{{lastName}}</p>
    </article>
    {{/each}}
</section>

App \ router.js,添加

this.route("userLists", { path: "/userList" });

Controllers \ UserListController.cs,sample:

public class UserListController : ApiController
{
    private TodoItemContext db = new TodoItemContext();

    // GET api/userList
    public List<UserDto> GetUserLists()
    {
        var u = new User
        {
            Email = "test@test.com",
            FirstName = "first",
            LastName = "last",
            AccountId = "1324"
        };
        List<UserDto> users = new List<Models.UserDto>();
        users.Add(new UserDto(u));
        return users;
    }

    protected override void Dispose(bool disposing)
    {
        db.Dispose();
        base.Dispose(disposing);
    }
}

模型\ User.cs

public class User
{
    public User() { }

    [Key]
    public string Email { get; set; }

    public string FirstName { get; set; }

    public string LastName { get; set; }

    public string AccountId { get; set; }
}


public class UserDto
{
    public UserDto() { }

    public UserDto(User user)
    {
        Email = user.Email;
        FirstName = user.FirstName;
        LastName = user.LastName;
        AccountId = user.AccountId;
    }

    [Key]
    public string Email { get; set; }

    public string FirstName { get; set; }

    public string LastName { get; set; }

    public string AccountId { get; set; }
}

答案 1 :(得分:0)

看起来Ember.js希望您的API响应数据如下:

{ 
    "user": {
        "Email": "johnsmith@test.com",
        "FirstName": "John",
        "LastName": "Smith",
        "AccountId": "AccountJS"
    }
}

我不知道您提及的webapi_adapter,但这是RESTAdapter期望格式化响应的方式:http://emberjs.com/api/data/classes/DS.RESTAdapter.html