jhades

@Component({
  selector: 'app-root',
  template: `      
      <ng-template>
          <button class="tab-button" 
                  (click)="login()">{{loginText}}</button>
          <button class="tab-button" 
                  (click)="signUp()">{{signUpText}}</button>
      </ng-template>

jhades

import { MatInputModule, MatPaginatorModule, MatProgressSpinnerModule, 
         MatSortModule, MatTableModule } from "@angular/material";

@NgModule({
    declarations: [
        ... 
    ],
    imports: [
        BrowserModule,

jhades

@Component({
  selector: 'login',
  templateUrl: './login.component.html',
  styleUrls: ['./login.component.css']
})
export class LoginComponent {

   form = this.fb.group({
      email: ["", {

jhades

@Component({
  selector: 'app-home',
  template: `
    <h2>All Lessons</h2>
    <h4>Total Lessons: {{lessons?.length}}</h4>

    <div class="lessons-list-container v-h-center-block-parent">
        <table class="table lessons-list card card-strong">
            <tbody>
            <tr *ngFor="let lesson of lessons" (click)="selectLesson(lesson)">

jhades

{
    "-KgVwEC-dwWkLO4ZsQ9e": {
        "description": "Angular Tutorial For Beginners - Build Your First App - Hello World Step By Step",
        "longDescription": "This is step by step guide to create your first Angular application. Its aimed at beginners just starting out with the framework.This lesson will show how to create a component, and how to link the component to a given custom HTML tag. It will show how to give the component a given template.",
        "tags": "BEGINNER",
        "url": "angular-hello-world-write-first-application",
        "videoUrl": "https://www.youtube.com/embed/du6sKwEFrhQ"
    },
    "-KgVwEC0vq_chg0dvlrb": {
        "courseId": "-KgVwEBq5wbFnjj7O8Fp",

jhades

// create an empty object - no class was needed !!
var superhero = {};
 
superhero.name = 'Superman';  
superhero.strength = 100;

jhades

<div [formGroup]="form">

    <input placeholder="Course title" formControlName="title">
  
    <input type="checkbox" placeholder="Free course" formControlName="free">

    <textarea placeholder="Description" formControlName="longDescription">

    </textarea>
      

jhades

export declare const Breakpoints: {
    XSmall: string;
    Small: string;
    Medium: string;
    Large: string;
    XLarge: string;
    Handset: string;
    Tablet: string;
    Web: string;
    HandsetPortrait: string;

jhades

  <mat-form-field appearance="outline">

    <input matInput formControlName="releasedAt">

  </mat-form-field>

jhades

export interface Thread {
    id:number;
    messageIds: number[];
    participants: {[key:number]: number};
}


export interface Message {
    id:number;