new structure

.vs/VSWorkspaceState.json

@@ -3,7 +3,6 @@
     "",
     "\\src",
     "\\src\\app",
-    "\\src\\app\\about",
     "\\src\\app\\boards"
   ],
   "PreviewInSolutionExplorer": false

src/app/about/about.component.ts

@@ -1,6 +1,6 @@
 import { Component, OnInit } from '@angular/core';
             // двач лучший двач
-import { ApiChatService } from '../api-chat.service';
+import { ApiChatService } from '../services/api-chat.service';
 
 @Component({
   selector: 'app-about',

src/app/api-chat.service.ts

@@ -1,8 +0,0 @@
-import { Injectable } from '@angular/core';
-
-@Injectable({
-  providedIn: 'root'
-})
-export class ApiChatService {
-  
-  }

src/app/app.module.ts

@@ -8,9 +8,10 @@ import { HomeComponent } from './home/home.component';
 import { AboutComponent } from './about/about.component';
 import { BoardsComponent } from './boards/boards.component';
 import { NotFoundComponent } from './not-found/not-found.component';
-import { ApiChatService } from './api-chat.service';
+import { ApiChatService } from './services/api-chat.service';
 import { FormsModule } from '@angular/forms';
 import { SendPostComponent } from './boards/send-post/send-post.component';
+import { PostComponent } from './boards/post/post.component'
 
 const appRoutes: Routes = [
   { path: '', component: HomeComponent },
@@ -26,7 +27,8 @@ const appRoutes: Routes = [
     AboutComponent,
     BoardsComponent,
     NotFoundComponent,
-    SendPostComponent
+    SendPostComponent,
+    PostComponent
   ],
   imports: [
     BrowserModule,

src/app/boards/boards.component.html

@@ -1,18 +1,13 @@
 <div class="wrappe">
 <img src="http://static.vdk2ch.ru:15555/test-public/16657431265390.png" alt="свiня" width="150">
- <app-send-post></app-send-post>,
+<app-send-post></app-send-post>,
+<button (click)="refreshPosts()">Обновить</button>
+<post-single
+  *ngFor="let post of postsToShow" [post]="post"
+></post-single>
+<p></p>
+<button (click)="refreshPosts()">Обновить</button>
 
-<button (click)="listPosts()">Обновить</button>
-<div *ngIf="response">
-  <div  class="singlePost" *ngFor="let post of response">
-    <a href="#{{post.Id}}"></a>
-      <img src="http://static.vdk2ch.ru:15555/test-public/оладий.jpg" alt="anonpls" width="140"> 
-      <p> >>{{post.Id}} {{post.Date}}</p>
-      <p>{{post.Text}}</p>
-    
-  </div>
-
-</div>
 <br>
 <div class="hexagon">
   <div class="hexagon-inside">

src/app/boards/boards.component.ts

@@ -1,6 +1,8 @@
-import { Component, OnInit } from '@angular/core';
+import { Component, Input, OnInit } from '@angular/core';
-import { ApiChatService } from '../api-chat.service';
+import { ApiChatService } from '../services/api-chat.service';
 import { HttpClient } from '@angular/common/http';
+import { SinglePost } from '../models/post'
+import { receivedPosts } from '../data/ResponseTemplate'
 
 @Component({
   selector: 'app-boards',
@@ -10,24 +12,24 @@ import { HttpClient  } from '@angular/common/http';
 export class BoardsComponent implements OnInit {
   command: string = "";
   response: any;
+  postsToShow: SinglePost[] = [] //products: Iproduct[] = data
 
-  constructor(private http: HttpClient) {
+  constructor(public apiChatService: ApiChatService) {
-    console.log("Boards opened");
 
   }
 
-  listPosts() {
+  refreshPosts() {
-    console.log("Получаю данные...");
+    this.apiChatService.getPosts().subscribe(response => {
-    this.http.get('http://api.vdk2ch.ru:5000/List')
+      this.postsToShow = response
-      .subscribe((response)=> {
-        this.response = response;
-        console.log(this.response);
     })
   }
 
   ngOnInit(): void {
-    this.listPosts();
+    this.apiChatService.getPosts().subscribe(response => {
+    this.postsToShow = response
+    })
   }
 
 
 }
+

src/app/boards/post/post.component.css

@@ -0,0 +1,10 @@
+.post {
+  border-width: 1;
+  border-color: rgb(190,190,190);
+  border-style: solid;
+  background-color: #F0D0B6;
+  border-radius: 5px;
+  width: 500px;
+  word-break: break-word;
+  word-wrap: break-word;
+}

src/app/boards/post/post.component.html

@@ -0,0 +1,5 @@
+<div class="post">
+  <img src="http://static.vdk2ch.ru:15555/test-public/оладий.jpg" alt="anonpls" width="140"> #  {{post.Id}} 
+  <h3>{{post.Date}}</h3>
+  <h2>{{post.Text}}</h2>
+</div>

src/app/boards/post/post.component.ts

@@ -0,0 +1,19 @@
+import { Component, OnInit, Input } from '@angular/core';
+import { SinglePost } from '../../models/post';
+
+
+
+
+@Component({
+  selector: 'post-single',
+  templateUrl: './post.component.html',
+  styleUrls: [`./post.component.css`]
+})
+export class PostComponent implements OnInit {
+
+
+  @Input() post: SinglePost
+     
+  ngOnInit(): void {
+  }
+}

src/app/boards/send-post/send-post.component.ts

@@ -1,5 +1,6 @@
 import { Component, OnInit } from '@angular/core';
 import { HttpClient } from '@angular/common/http';
+import { ApiChatService } from '../../services/api-chat.service';
 
 @Component({
   selector: 'app-send-post',
@@ -8,23 +9,12 @@ import { HttpClient } from '@angular/common/http';
 })
 export class SendPostComponent implements OnInit {
 
-  constructor(private http: HttpClient) {
+  constructor(public apiChatService: ApiChatService) {
-    console.log("Открыто окно постинга");
   }
 
   sendPost(text: string) {
     console.log("Отправляю пост...");
-    var postToSend =
+    this.apiChatService.sendPostToApi(text).subscribe();
-    {
-      Date: Date,
-      Id: 0,
-      Text: text
-    }
-
-
-    this.http.post('http://api.vdk2ch.ru:5000/PostTo', postToSend).subscribe();
-
-
   }
 
 

src/app/data/ResponseTemplate.ts

@@ -0,0 +1,189 @@
+import { SinglePost } from '../models/post'
+
+export const receivedPosts: SinglePost[] = [
+    {
+      "Date": "2022-10-22T02:53:17.3742479+00:00",
+      "Id": 1,
+      "Text": "moi post"
+    },
+    {
+      "Date": "2022-10-22T02:53:17.3742571+00:00",
+      "Id": 2,
+      "Text": " post #2 "
+    },
+    {
+      "Date": "2022-10-22T02:53:17.3742581+00:00",
+      "Id": 3,
+      "Text": "dvach live2"
+    },
+    {
+      "Date": "2022-10-22T02:53:17.3742589+00:00",
+      "Id": 4,
+      "Text": "again"
+    },
+    {
+      "Date": "2022-10-22T02:53:17.3742597+00:00",
+      "Id": 5,
+      "Text": "PRIVET DVACH"
+    },
+    {
+      "Date": "2022-10-22T02:53:17.3742615+00:00",
+      "Id": 6,
+      "Text": "Привет двач"
+    },
+    {
+      "Date": "2022-10-22T02:53:17.3742628+00:00",
+      "Id": 7,
+      "Text": "Введено через консольку напрямую."
+    },
+    {
+      "Date": "2022-10-22T02:53:17.3754268+00:00",
+      "Id": 8,
+      "Text": " А я люблю обмазываться не свежим говном и дрочить. Каждый день я хожу по земле с черным мешком для мусора и собераю в него все говно которое вижу. На два полных мешка целый день уходит. Зато, когда после тяжёлого дня я прихожу домой, иду в ванну, включаю горячую воду...ммм и сваливаю в нее свое сокровище. И дрочу, представляя, что меня поглотил единый организм говно. Мне вообще кажется, что какашки, умеют думать, у них есть свои семьи, города, чувства, не смывайте их в унитаз, лучше приютите у себя, говорите с ними, ласкайте их.... А вчера в ванной, мне преснился чудный сон, как будто я нырнул в море, и оно прератилось в говно, рыбы, водоросли, медузы, все из говна, даже небо, даже Аллах.\n\nприслал: вован кротов "
+    },
+    {
+      "Date": "2022-10-22T02:53:17.3754479+00:00",
+      "Id": 13,
+      "Text": "ДЕФОЛТНОЕ ЗНАЧЕНИЕ"
+    },
+    {
+      "Date": "2022-10-22T02:53:17.3754511+00:00",
+      "Id": 14,
+      "Text": "ЩИТПОСТИНГ ТАЙМ"
+    },
+    {
+      "Date": "2022-10-22T02:53:17.3754524+00:00",
+      "Id": 15,
+      "Text": "САП БЭ Я ТЯН"
+    },
+    {
+      "Date": "2022-10-22T02:53:17.3754536+00:00",
+      "Id": 16,
+      "Text": "ПРУФОВ НЕ БУДЕТ"
+    },
+    {
+      "Date": "2022-10-22T02:53:17.3754548+00:00",
+      "Id": 17,
+      "Text": "ЭКЗЕШНИК ЗАПИЛИЛ"
+    },
+    {
+      "Date": "2022-10-22T02:53:17.3754559+00:00",
+      "Id": 18,
+      "Text": "Пробую выводить значения в другом порядке, немного допилил консольный интерфейс."
+    },
+    {
+      "Date": "2022-10-22T02:53:17.3754578+00:00",
+      "Id": 19,
+      "Text": "Subquery added and worked!"
+    },
+    {
+      "Date": "2022-10-22T02:53:17.375459+00:00",
+      "Id": 20,
+      "Text": "А теперь в браузере!"
+    },
+    {
+      "Date": "2022-10-22T02:53:17.3754607+00:00",
+      "Id": 21,
+      "Text": "Проверяю"
+    },
+    {
+      "Date": "2022-10-22T02:53:17.3754622+00:00",
+      "Id": 22,
+      "Text": "test from linus"
+    },
+    {
+      "Date": "2022-10-22T02:53:17.3754636+00:00",
+      "Id": 23,
+      "Text": "Postman"
+    },
+    {
+      "Date": "2022-10-22T02:53:17.3754648+00:00",
+      "Id": 25,
+      "Text": "Checked to server"
+    },
+    {
+      "Date": "2022-10-22T02:53:17.375466+00:00",
+      "Id": 29,
+      "Text": "Чекаю борду"
+    },
+    {
+      "Date": "2022-10-22T02:53:17.3754675+00:00",
+      "Id": 30,
+      "Text": "Опять прон налили"
+    },
+    {
+      "Date": "2022-10-22T02:53:17.375469+00:00",
+      "Id": 31,
+      "Text": "Проверка связи"
+    },
+    {
+      "Date": "2022-10-22T02:53:17.3754704+00:00",
+      "Id": 32,
+      "Text": "Алё, это телефон АТС?"
+    },
+    {
+      "Date": "2022-10-22T02:53:17.375472+00:00",
+      "Id": 33,
+      "Text": "Ах ты сука спидовый!"
+    },
+    {
+      "Date": "2022-10-22T02:53:17.3754736+00:00",
+      "Id": 38,
+      "Text": "Печатать сюда"
+    },
+    {
+      "Date": "2022-10-22T02:53:17.375475+00:00",
+      "Id": 39,
+      "Text": "Или не печатать сюда."
+    },
+    {
+      "Date": "2022-10-22T02:53:17.3754765+00:00",
+      "Id": 40,
+      "Text": "это мой первый пост через интернет"
+    },
+    {
+      "Date": "2022-10-22T02:53:17.3754785+00:00",
+      "Id": 41,
+      "Text": "Ну ка бля"
+    },
+    {
+      "Date": "2022-10-22T02:53:17.37548+00:00",
+      "Id": 42,
+      "Text": "Ого"
+    },
+    {
+      "Date": "2022-10-22T02:53:17.3757265+00:00",
+      "Id": 43,
+      "Text": "Ого"
+    },
+    {
+      "Date": "2022-10-22T02:53:17.3757291+00:00",
+      "Id": 44,
+      "Text": "Чё то тиха бля"
+    },
+    {
+      "Date": "2022-10-22T02:53:17.3757303+00:00",
+      "Id": 45,
+      "Text": "Печатать сюда"
+    },
+    {
+      "Date": "2022-10-22T02:53:17.375732+00:00",
+      "Id": 46,
+      "Text": "ВСЕМ ПРИВЕТ, Я ФОКУСНИК!"
+    },
+    {
+      "Date": "2022-10-22T02:53:17.3757334+00:00",
+      "Id": 47,
+      "Text": "Как пропатчить инпуты под KDE?"
+    },
+    {
+      "Date": "2022-10-22T02:53:17.3757353+00:00",
+      "Id": 48,
+      "Text": "Печатать.  Я не должен это руками стирать "
+    },
+    {
+      "Date": "2022-10-22T02:53:17.3757373+00:00",
+      "Id": 51,
+      "Text": "пишу с телефона "
+    }
+]

src/app/home/home.component.ts

@@ -1,5 +1,5 @@
 import { Component, OnInit } from '@angular/core';
-import { ApiChatService } from '../api-chat.service';
+import { ApiChatService } from '../services/api-chat.service';
 
 @Component({
   selector: 'app-home',

src/app/models/post.ts

@@ -0,0 +1,6 @@
+export interface SinglePost {
+  Date: string
+  Id: number
+  Text: string
+
+}

src/app/not-found/not-found.component.html

@@ -1 +1 @@
-<p>not-found works!</p>
+<p>Страничка не найдена. Попробуйте внимательнее.</p>

src/app/not-found/not-found.component.ts

@@ -2,7 +2,8 @@ import { Component, OnInit } from '@angular/core';
 
 @Component({
   selector: 'app-not-found',
-  template: `<h3>Страница не найдена.<h3>`
+  templateUrl: './not-found.component.html',
+  styleUrls: ['./not-found.component.css']
 })
 export class NotFoundComponent implements OnInit {
 

src/app/services/api-chat.service.ts

@@ -0,0 +1,28 @@
+import { Injectable } from '@angular/core';
+import { HttpClient } from '@angular/common/http';
+import { Observable } from 'rxjs';
+import { SinglePost } from '../models/post';
+
+@Injectable({
+  providedIn: 'root'
+})
+export class ApiChatService {
+  constructor(private http: HttpClient) {
+  }
+
+  getPosts(): Observable<SinglePost[]> {
+    console.log("Получаю данные из сервиса");
+    return this.http.get<SinglePost[]>('http://localhost:7141/List');
+  }
+
+    sendPostToApi(text: string) {
+    console.log("Отправляю пост...");
+    var postToSend =
+    {
+      Date: Date,
+      Id: 0,
+      Text: text
+    }
+      return this.http.post('http://localhost:7141/PostTo', postToSend)
+  }
+}

tsconfig.json

@@ -7,7 +7,7 @@
     "forceConsistentCasingInFileNames": true,
     "strict": true,
     "noImplicitOverride": true,
-    "noPropertyAccessFromIndexSignature": true,
+    "noPropertyAccessFromIndexSignature": false,
     "noImplicitReturns": true,
     "noFallthroughCasesInSwitch": true,
     "sourceMap": true,
@@ -21,7 +21,8 @@
     "lib": [
       "es2020",
       "dom"
-    ]
+    ],
+    "strictPropertyInitialization" : false
   },
   "angularCompilerOptions": {
     "enableI18nLegacyMessageIdFormat": false,