app.component.html 1.62 KB
<!-- Toolbar -->
<div class="toolbar" role="banner">
  <img width="40" alt="Angular Logo"
    src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNTAgMjUwIj4KICAgIDxwYXRoIGZpbGw9IiNERDAwMzEiIGQ9Ik0xMjUgMzBMMzEuOSA2My4ybDE0LjIgMTIzLjFMMTI1IDIzMGw3OC45LTQzLjcgMTQuMi0xMjMuMXoiIC8+CiAgICA8cGF0aCBmaWxsPSIjQzMwMDJGIiBkPSJNMTI1IDMwdjIyLjItLjFWMjMwbDc4LjktNDMuNyAxNC4yLTEyMy4xTDEyNSAzMHoiIC8+CiAgICA8cGF0aCAgZmlsbD0iI0ZGRkZGRiIgZD0iTTEyNSA1Mi4xTDY2LjggMTgyLjZoMjEuN2wxMS43LTI5LjJoNDkuNGwxMS43IDI5LjJIMTgzTDEyNSA1Mi4xem0xNyA4My4zaC0zNGwxNy00MC45IDE3IDQwLjl6IiAvPgogIDwvc3ZnPg==" />
  <div>
    <span>Home</span>
    <span>นศ.</span>
    <span>คะแนน</span>
    <span class="spacer"></span>
    <a href="#">Login</a>
    <div class="spacer"></div>
  </div>
</div>
<!-- Students -->
<div class="content" role="main">
  <h1><b>Students</b></h1>
  <br>
  <div *ngFor='let s of students' class="card w-50">
    <span>{{s.id}} {{s.name}} {{s.email}}</span>
  </div>
</div>
<!-- Courses -->
<div class="content" role="main">
  <h1><b>Courses</b></h1>
  <br>
  <div *ngFor='let c of courses' class="card w-50">
    <span>{{c.title}} {{c.description}}</span>
  </div>
</div>
<!-- Lecturers -->
<div class="content" role="main">
  <h1><b>Lecturers</b></h1>
  <br>
  <div *ngFor='let l of lecturers' class="card w-50">
    <span>{{l.id}} {{l.name}}</span>
  </div>
</div>
<!-- Scores -->
<div class="content" role="main">
  <h1><b>Scores</b></h1>
  <br>
  <div *ngFor='let sc of scores' class="card w-50">
    <span>{{sc.student}} {{sc.score}} {{sc.full_mark}}</span>
  </div>
</div>
<router-outlet></router-outlet>