如何在 HTML 中查看我的 typeScript 的结果？

Question

This is my HTML
*i changed all the code

<div class="testCenter">
    <h1>{{teston()}}</h1>
</div>

This is my .ts code the function teston() i dont know if it make sense

import { Component, OnInit } from '@angular/core';
import { Carte } from '../mesClass/Carte'; // importation de la class Carte

@Component({
  selector: 'app-gestion-poker',
  templateUrl: './gestion-poker.component.html',
  styleUrls: ['./gestion-poker.component.css']
})
export class GestionPokerComponent implements OnInit {

  test:Carte;

  constructor() { }

  ngOnInit(): void {
  }


  teston(){

  return this.test.carte(1);
    
  }

}

This is my class Carte.ts

export class Carte {

    // Attributs
    sorte = new Array;
    
    carte(sor){

        this.sorte = sor;
      

        sor = ["hello","Bob"];
       
        
    }

}

So what i want to do is to see in my HTML: Bob
nothing seems to work am i missing something?

Answer 1

I think:

1. Your test is not defined. You need to create a new Carte type object.
2. In your carte class you are creating a public globa variable that's type is an Array, but in the function cart(sor), you overwrite it with a number.

Depending on your code, i think you want somethink like this:

export class Carte {
    sorte: Array<string> = ['hello', 'Bob'];
    
    carte(sor){
      return this.sorte[sor]  
    }
}

And in your ts file something like this:

import { Component, OnInit } from '@angular/core';
import { Carte } from '../mesClass/Carte'; // importation de la class Carte

@Component({
  selector: 'app-gestion-poker',
  templateUrl: './gestion-poker.component.html',
  styleUrls: ['./gestion-poker.component.css']
})
export class GestionPokerComponent implements OnInit {

  test:Carte;

  constructor() { }

  ngOnInit(): void {
     this.test = new Carte();
  }


  teston(){
     return this.test.carte(1);
  }

}