Я создаю веб-сайт для моей компании, специализирующейся на гитаре, и я только что понял, что есть кое-что о том, как должна работать база данных, что я не могу, кажется, обернуть голову - или, может быть, я обдумываю это ипутаю себя.
Есть две таблицы, которые мне нужно связать друг с другом: таблица Artists
и таблица Projects
.В таблице artists
хранится информация об отдельных исполнителях, а в таблице Projects
хранится информация о группах / проектах.
Достаточно просто создать таблицу Artists
и использовать ее первичный ключ в качестве внешнего ключа в таблице Projects
;и если один художник участвовал в нескольких проектах, то это не проблема.Однако мне приходит в голову то, что вполне возможно иметь один проект, связанный с более чем одним артистом.
Я знаю, что было бы несовместимо с обычными формами иметь поле artist_id
в качестве внешнего ключа в таблице Projects
, если бы оно имело несколько значений (не атомарных);но я не уверен, как еще я мог бы достичь этого.
Также может быть полезно узнать сценарий использования:
Я создаю серверную часть Django-REST, которая будет использоваться интерфейсом Angular.Есть страница с профилями художников, которые Angular анализирует из JSON, используя *ngFor
.Таким образом, каждый фрагмент HTML, добавленный к DOM
с *ngFor
, будет отображать имя исполнителя, биографию и рисунок;проекты, с которыми связан художник, добавляются в DOM
через цикл inner-ngFor.
Вот структуры данных с угловой стороны:
import {ArtistSocialMediaModel} from './artist-social-media.model';
export class ArtistProfilesModel {
public artist_name: string;
public artist_image: string;
// the second string is a range of active dates for a given project
// which I will convert to a string in Django before serializing
public projects: Array<[string, string]>;
public description: string;
public band_website: string;
public social_media: ArtistSocialMediaModel[];
constructor(name: string, image: string, projects,
description: string, website: string, social) {
this.artist_name = name;
this.artist_image = image;
this.projects = projects;
this.description = description;
this.band_website = website;
this.social_media = social;
}
}
Это социальная сеть.модель мультимедиа, которую вы видите выше, но это будет прямое отношение один к одному с таблицей Artists_Social
:
export class ArtistSocialMediaModel {
public facebook: string;
public twitter: string;
public instagram: string;
constructor(facebook: string, twitter: string, instagram: string) {
this.facebook = facebook;
this.twitter = twitter;
this.instagram = instagram;
}
}
Это шаблон, который отображает данные:
<div *ngFor="let profile of artistProfiles; let i = index"
class="profiles-div">
<div *ngIf="resolveIndex(i) === 'left'; then left else right">ignored</div>
<ng-template #left>
<div class="row">
<div class="col-6 col-md-5">
<img [src]="profile.artist_image"
[alt]="profile.artist_name"
class="img-thumbnail img-fluid"
[ngStyle]="{ 'float': resolveIndex(i)}">
<h1 class="artists-jumbo-header"
[ngStyle]="{ 'text-align': resolveIndex(i)}">
Projects:
</h1>
<p *ngFor="let project of profile.projects"
[ngStyle]="{ 'text-align': resolveIndex(i)}"
class="artists-p">
{{project[0] + ": " + project[1]}}
</p>
<h1 class="artists-jumbo-header"
[ngStyle]="{ 'text-align': resolveIndex(i)}">
Website:
</h1>
<a href="https:{{profile.band_website}}"
target="_blank">
<p [ngStyle]="{ 'text-align': resolveIndex(i)}"
class="artists-p">
{{profile.band_website}}
</p>
</a>
<h1 class="artists-jumbo-header"
[ngStyle]="{ 'text-align': resolveIndex(i)}">
Social Media:
</h1>
<a href="https://{{profile.social_media['facebook']}}"
target="_blank">
<p [ngStyle]="{ 'text-align': resolveIndex(i)}"
class="artists-p">{{profile.social_media['facebook']}}</p>
</a>
<a href="https://{{profile.social_media['twitter']}}"
target="_blank">
<p [ngStyle]="{ 'text-align': resolveIndex(i)}"
class="artists-p">{{profile.social_media['twitter']}}</p>
</a>
<a href="https://{{profile.social_media['instagram']}}"
target="_blank">
<p [ngStyle]="{ 'text-align': resolveIndex(i)}"
class="artists-p">
{{profile.social_media['instagram']}}</p>
</a>
</div>
<div class="col-6 col-md-7">
<h1 class="artists-jumbo-header">{{ profile.artist_name }}
</h1>
<br>
<p class="artists-p">{{ profile.description }}</p>
</div>
</div>
</ng-template>
<ng-template #right>
<div class="row ng-template-right">
<div class="col-6 col-md-7">
<h1 class="artists-jumbo-header">{{ profile.artist_name }}
</h1>
<br>
<p class="artists-p">{{ profile.description }}</p>
</div>
<div class="col-6 col-md-5">
<img [src]="profile.artist_image"
[alt]="profile.artist_name"
class="img-thumbnail"
[ngStyle]="{ 'float': resolveIndex(i)}">
<div class="container">
<h1 class="artists-jumbo-header"
[ngStyle]="{ 'text-align': resolveIndex(i)}">
Projects:
</h1>
<p *ngFor="let project of profile.projects"
[ngStyle]="{ 'text-align': resolveIndex(i)}"
class="artists-p">
{{project[0] + ": " + project[1]}}
</p>
<h1 class="artists-jumbo-header"
[ngStyle]="{ 'text-align': resolveIndex(i)}">
Website:
</h1>
<a href="https:{{profile.band_website}}"
target="_blank">
<p [ngStyle]="{ 'text-align': resolveIndex(i)}"
class="artists-p">
{{profile.band_website}}
</p>
</a>
<h1 class="artists-jumbo-header"
[ngStyle]="{ 'text-align': resolveIndex(i)}">
Social Media:
</h1>
<a href="https://{{profile.social_media['facebook']}}"
target="_blank">
<p [ngStyle]="{ 'text-align': resolveIndex(i)}"
class="artists-p">{{profile.social_media['facebook']}}</p>
</a>
<a href="https://{{profile.social_media['twitter']}}"
target="_blank">
<p [ngStyle]="{ 'text-align': resolveIndex(i)}"
class="artists-p">{{profile.social_media['twitter']}}</p>
</a>
<a href="https://{{profile.social_media['instagram']}}"
target="_blank">
<p [ngStyle]="{ 'text-align': resolveIndex(i)}"
class="artists-p">
{{profile.social_media['instagram']}}</p>
</a>
</div>
</div>
</div>
</ng-template>
<hr>
</div>