eya eya - 1 month ago 8
TypeScript Question

ionic 2 - one to many services

I have a list of users which every user can have zero, one or many files , so the relation between users table and files table is one to many

In my backend project I can have the list of users and files as a list in every user entity .. And in my front end I want to show the user details with his attachments (files)

this is my code :

user: {username?: string, password?: string, files: {docfile?: string}} = {};

constructor(public navParams: NavParams) {
this.user = navParams.data;
}


and this is the html part :

<ion-content padding>

<ion-label>username : </ion-label>
{{user.username}}
</p>

<p>
<ion-label>Documents : </ion-label>
<img src={{user.documents.docfile}} />

</p>

</ion-content>


what should I do please ??

Answer

In your html you're referencing user.documents.docfile while in your ts you set your filestring to be user.files.docfile.

I don't know what you're calling the docfile in your backend but I guess it's files.

So changing your html to user.files.docfile should work. (if it's an image)

if it's not an image you won't get it as files: {docfile?: string}} but as files: [{docfile?: string}] in that case you can do the following in your html

    <ion-label>Documents : </ion-label>
    <ion-list>
      <ion-item *ngFor="let file of user.files">
        <img [src]="file.docfile"/> <!-- if it's an image -->
      </ion-item>
     </ion-list>