Блог

помогите мне, пожалуйста. Я создаю приложение на основе курса, но курс основан на asp.net сердечник 2 и угловой 5. Но я делаю все в текущих версиях. Существует проблема, которую я не могу решить.

У меня есть контроллер, который возвращает список тестов из последнего метода в формате JSON.

QuizController.cs

 //GET api/quiz/latest
[HttpGet("Latest/{num?}")]
public IActionResult Latest(int num = 10)
{
  [other operations...]
  return new JsonResult(sampleQuizzes, new JsonSerializerOptions() { WriteIndented = true });
}
  

До тех пор все работает, потому что при вызове GET в postman отображается список.

Затем я хотел добавить клиентскую часть в Angular и отобразить список на ДОМАШНЕЙ странице.

ClientApp/src/app/quiz/quiz-list.component.ts

 import { Component, Inject } from "@angular/core";   
import { HttpClient } from "@angular/common/http";   

@Component({
  selector: "quiz-list",                     
  templateUrl: './quiz-list.component.html',  
  styleUrls: ['./quiz-list.component.css']   
})

export class QuizListComponent {           
  title: string;
  selectedQuiz: Quiz;
  quizzes: Quiz[];

  constructor(http: HttpClient,
    @Inject('BASE_URL') baseUrl: string) {
    this.title = "Lists of latest quizzes";
    var url = baseUrl   "api/quiz/Latest";
    http.get<Quiz[]>(url).subscribe(result => {  
      this.quizzes = resu<                    
    }, error => console.error(error));
  }

  onSelect(quiz: Quiz) {                         
    this.selectedQuiz = quiz;
    console.log("You choose quiz id "   this.selectedQuiz.Id);
  }
}
  

ClientApp/src/app/quiz/quiz-list.component.html

 <h2>{{title}}</h2>      
<ul class="quizzes">
  <li *ngFor="let quiz of quizzes"
      [class.selected]="quiz === selectedQuiz" 
      (click)="onSelect(quiz)">          
    <span>{{quiz.Title}}</span>   
  </li>
</ul>
  

ClientApp /src/app/app.module.ts

 [...]
import { QuizListComponent } from './quiz/quiz-list.component';
@NgModule({
  declarations: [
    AppComponent,
    NavMenuComponent,
    HomeComponent,
    QuizListComponent   
  ],
  imports: [

[...]
  

После запуска приложения на моем веб-сайте отображается только название компонента из шаблона html: «Списки последних тестов». Ничего больше. Кто-нибудь знает, где ошибка?