Hibernate 角度5：选择所有具有相关角色一个角色关系的用户

我试图选择所有具有相关角色的用户，因为我知道一个角色可以与多个联系人相关，而一个联系人有一个角色

<tr *ngFor="let c of pageContacts?.content">
    <td class="py-1">
        <img src="../../assets/images/faces-clipart/pic-1.png" alt="image"/>
    </td>
    <td>{{c[0].email}}</td>
    <td>{{c[0].phone}}</td>
    <td>{{c[0].firstName}}</td>
    <td>{{c[0].lastName}}</td>
    <td>{{c[0].job}}</td>
    <td>{{c[0].birthday}}</td>
    <td>{{c[1]}}</td>
</tr>

我尝试了下面的代码，但它只返回一个空白表，这是hibernate的问题还是我如何调用company name列的问题

<tr *ngFor="let c of pageContacts?.content">
    <td class="py-1">
        <img src="../../assets/images/faces-clipart/pic-1.png" alt="image"/>
    </td>
    <td>{{c[0].email}}</td>
    <td>{{c[0].phone}}</td>
    <td>{{c[0].firstName}}</td>
    <td>{{c[0].lastName}}</td>
    <td>{{c[0].job}}</td>
    <td>{{c[0].birthday}}</td>
    <td>{{c[1]}}</td>
</tr>

ContactRepository.java

@Query("SELECT c, cmp.name FROM Contact c, Company cmp WHERE c.company=cmp.id")
public Page<Contact> search(Pageable page);

<tr *ngFor="let c of pageContacts?.content">
    <td class="py-1">
        <img src="../../assets/images/faces-clipart/pic-1.png" alt="image"/>
    </td>
    <td>{{c[0].email}}</td>
    <td>{{c[0].phone}}</td>
    <td>{{c[0].firstName}}</td>
    <td>{{c[0].lastName}}</td>
    <td>{{c[0].job}}</td>
    <td>{{c[0].birthday}}</td>
    <td>{{c[1]}}</td>
</tr>

contacts.component.ts

@Injectable()
export class ContactsService {

  constructor(private http:HttpClient){}

  getContacts(){
    return this.http.get("http://localhost:8080/searchContacts?page=0&size=6")
  }

}

@Component({
  selector: 'app-contacts',
  templateUrl: './contacts.component.html',
  styleUrls: ['./contacts.component.css']
})
export class ContactsComponent implements OnInit {

  pageContacts:any;
  constructor(private contactsService:ContactsService) { }

  ngOnInit() {
    console.log("Initialisation......");
    this.contactsService.getContacts()
      .subscribe(data =>{
        console.log(data);
        this.pageContacts=data;
      }, err=>{
      console.log("ALERT!!!!!"+err);
      })
  }

}

<tr *ngFor="let c of pageContacts?.content">
    <td class="py-1">
        <img src="../../assets/images/faces-clipart/pic-1.png" alt="image"/>
    </td>
    <td>{{c[0].email}}</td>
    <td>{{c[0].phone}}</td>
    <td>{{c[0].firstName}}</td>
    <td>{{c[0].lastName}}</td>
    <td>{{c[0].job}}</td>
    <td>{{c[0].birthday}}</td>
    <td>{{c[1]}}</td>
</tr>

---

事实上，响应是一个数组，因此当我将代码更改为以下内容时，它可以工作：

<tr *ngFor="let c of pageContacts?.content">
    <td class="py-1">
        <img src="../../assets/images/faces-clipart/pic-1.png" alt="image"/>
    </td>
    <td>{{c[0].email}}</td>
    <td>{{c[0].phone}}</td>
    <td>{{c[0].firstName}}</td>
    <td>{{c[0].lastName}}</td>
    <td>{{c[0].job}}</td>
    <td>{{c[0].birthday}}</td>
    <td>{{c[1]}}</td>
</tr>

{{c[0]。电子邮件}
{{c[0].电话}
{{c[0].firstName}
{{c[0].lastName}
{c[0]。作业}
{{c[0].生日}
{{c[1]}