Breeze navigation properties

Question

I have just started working with Breeze (using Angular) and have managed to get some data from my Odata service and displayed it on the page. However, I now need to get a related field via a foreign key (I need to get Group related to a Team object) and I am having some difficulties. Using datajs after version 1.0.3 causes issues so I am using version 1.0.3, but this version does not allow 'expand' to be used. So instead I have disabled lazy loading in my model and used Include when getting in my controller :

public partial class Team
    {
        public int TeamId { get; set; }
        public string TeamName { get; set; }
        public string FlagSmall { get; set; }
        public string FlagLarge { get; set; }
        public string BadgeSmall { get; set; }
        public string BadgeLarge { get; set; }
        public string TeamImage { get; set; }

        //foreign key
        public int GroupId { get; set; }
        //navigation properties
        public Group Group { get; set; }  //virtual removed to disable lazy loading
    }

    // GET odata/Teams 
            [Queryable]
            public IQueryable<Team> GetTeams()
            {
                return db.Teams.Include("Groups");   //get navigation property
            }

            // GET odata/Teams(5)
            [Queryable]
            public SingleResult<Team> GetTeam([FromODataUri] int key)
            {
                return SingleResult.Create(db.Teams.Include("Groups").Where(team => team.TeamId == key));
            }

However, this does not work either, it gives a similar error to the error caused by > datajs 1.0.3 :

[Q] Unhandled rejection reasons (should be empty): ["createError@http://bras...s/datajs-1.0.3.js:1055\n"]

Has anybody got around this and managed to get related fields via a foreign key?

EDIT :

Here is my angular code, I have tried referring to team.Group.GroupName, team.GroupName, and group.GroupName, but neither of these works :

<tbody>
    <tr ng-repeat="team in teams | filter:search:TeamName | orderBy:'TeamId'" id="team_{{team.id}}">
        <td>{{team.TeamId}}</td>
        <td>{{team.TeamName}}</td>
        <td><img src={{team.FlagSmall}}></img></td>
        <td><img style="width:40px;height:40px" src={{team.FlagLarge}}></img></td>
        <td><img style="width:40px;height:40px" src={{team.BadgeSmall}}></img></td>
        <td><img style="width:40px;height:40px" src={{team.BadgeLarge}}></img></td>
        <td><img style="width:80px;height:40px" src={{team.TeamImage}}></img></td>
        <td>{{team.Group.GroupName}}</td>
    </tr>
</tbody>

EDIT 2 :

This is my Breeze query :

this.basicTeamQuery = function () {
    return manager.executeQuery(entityQuery.from("Teams")).to$q();
};

EDIT 3 :

After some experimenting I managed to get this working with the following Breeze query :

this.basicTeamQuery = function () {
    return manager.executeQuery(entityQuery.from("Teams").
        select("TeamId, TeamName, FlagSmall, FlagLarge, BadgeSmall, BadgeLarge, TeamImage, " +
        "Group.GroupName").expand("Group")).to$q();
};

Not sure if this is the correct way to do this, or even if it should work...isn't expand supposed to not work with Angular?

EDIT 4 :

Here is the final working query, no need for the select above :

this.basicTeamQuery = function () {
    return manager.executeQuery(entityQuery.from("Teams").
        expand("Group")).to$q();
};

Answer 1

I just tried it and it worked for me without any issue.

I see a typo in the snippet you copied in the question. Name of your navigation property defined in the Item class is Group, but you passed "Groups" to the Include function. Can you try it by fixing the typo and update if you still face the issue?

UPDATE: It seems you cannot get the navigation property without using expand. Because, even the OData URL without expand doesn't send values of navigation properties despite of using Include in the LINQ query.

Answer 2

Try adding:

    [ForeignKey("GroupId")]
    [InverseProperty("Teams")]
    public Group Group { get; set; }

EDIT:

After checking once again, I noticed that relationship is different than what I thought at first glance. Since one Group has MANY Teams, try query the other way:

        [Queryable]
        public IQueryable<Group> GetGroupsWithTeams()
        {
            return db.Groups.Include("Teams");   //get navigation property
        }

That should return everything properly.