Interpolación

Es agregar texto dinámico nuestras plantilla HTML, se usa la sintaxis {{ valor }}. Por ejemplo:


Este texto dinámico debe de ir en export class del archivo de ts del componente:


Se puede poner una variable como private pero de esta forma no puede ser utilizada en el archivo html.
Para que se pueda usar se tiene que crear un método: 



Template Reference Variable

Podemos asignar un nombre a un componente de HTML y posteriormente usar el valor que almacena ese componente y poder usar la interpolación.
Por ejemplo:

Property Binding

Nos permite asignar valores a las propiedades de nuestros elementos HTML


En este ejemplo, dependiendo del valor que se le asigna a la variable es como se modificar la propiedad disabled, en este caso seria "true".


Event Binding 
Nos permite escuchar los eventos de nuestros componentes HTML. Esto con ayuda del evento (click) que es equivalente al evento onclick de javascript, solo que con el (click) es necesario hacer referencia a una propiedad.


    • Paso de Argumentos
      Y para obtener el valor de un input se usa el evento (input) en donde se captura el valor del input por medio de la variable "$event" y se envía al método del typescript para utilizarlo.
                     En este ejemplo, ya que se tiene el valor capturado y se convierte el valor para poderlo                             tratar y mostrarlo en el html.




Two-Way Binding
Es una forma de intercomunicar nuestros componentes, enviar información de nuestra plantilla de HTML hacia la clase de Angular o viceversa.

Lo primero que tenemos que hacer es agregar un nuevo modulo a nuestro proyecto de Angular para usar una propiedad que pertenece a los forms de Angular.

Modificamos el archivo de app.modules en la parte de imports y agregamos FormsModule como se puede observar en la imagen.


Con este método de Two-way binding no es necesario hacer uso de un método en la clase para modificar una variable. Y el código quedaría de la siguiente manera: