Simple formulario con databinding doble
El databinding doble es una de las propiedades mas conocidas de Angular. En esta ocasión vamos a ver un simple formulario en que implementamos databinding doble. A continuación les comparto el Video del proyecto terminado y mas abajo el código completo del componente en el que he agregado el formulario.
https://codepen.io/pedro-lara-peguero/project/editor/AbgqMq
Configuración del fichero httpd.conf en Centos
En esta ocasión les voy a compartir un vídeo de los primeros que realicé por allá por el año 2014 🙈🙈🙈🙈. En el video les comento como modificar el fichero httpd conf para poder trabajar con PHP en en Linux.Databinding de propiedad en Typescript
Pedro Lara
En esta ocasión veremos lo que se conoce en Typescript como Databinding de propiedad. A través de este Databinding podemos hacer que un componente hijo pueda recibir variables que hemos declarado en un componente padre. Para este ejemplo he creado un nuevo componente llamado hijo:
Ahora procederemos a crear en el componente principal, el cual será nuestro componente padre, una variable de tipo any a la cual le vamos a asignar un objeto:
Para poder acceder desde el componente hijo a las propiedades del componente padre hacemos lo siguiente:
Lo que hemos hecho es que en el template del componente padre hemos llamado al componente hijo y a la vez hemos creado una variable de nombre "[nombredelavariable]" a la cual le estamos asignado la variable de nombre persona que ya tenemos dispone en el componente padre. Ahora para poder hacer uso de la variable "[nombredelavariable]"dentro del componente hijo, debemos de llamarla dentro de este. Veamos:
Aquí hemos importado el Input, luego hemos utilizado esta propiedad para llamar la variable de nombre "nombredelavariable" que ya tenemos disponible en el template del componente hijo, esta variable se la asignamos a otra que hemos creado de nombre verificar. Ahora solo debemos hacer la típica interpolación para poder utilizarla. Y eso esto todo:
Nota: Si se presenta algún error, solo se debe importar import { FormsModule } from '@angular/forms'; en app.module.ts y luego agregarlo en import: imports: [BrowserModule,FormsModule
Si toda va bien ahora podremos ver en la vista la variable que definimos en el componente padre.
Quizás te interese:
Tipos primitivos en Angular 7
Pedro Lara
En angular 7, como en la mayoría de los lenguajes de programación, disponemos de lo que se conoce como tipos primitivos.Dentro de los tipos primitivos tenemos los siguientes:
Boolean
Este tipo de datos primitivos acepta dos valores: true o false:
let isDone:boolean= false;
Number
Este tipo de datos acepta prácticamente cualquier tipo de dato numérico:
let decimal:number= 7; let hex:number= 0xf00d; let binary:number= 0b1010; let octal:number= 0o744;Strimg
Este tipo de datos puede contener cadena de caracteres o texto:
let decimal:number= 7; let ciudad :string= Santiago;
Templates
A través del uso de las comillas invertidas podemos insertar en una variable tipo string texto multinlinea, ademas de que podemos concatenar otras variables.
var nombre:string = "Juan"; var saludo:string= `¡Hola ${nombre}!,Las puertas se abrieron a las 12; el público no tardó en ingresar`;
Array
Los array sino se les especifica por defecto son de tipo Any:
let list:number= [1,2,3,4]; let list:Array<number>= [1,2,3,4];
Any
Cuando definimos una variable de tipo any estamos deciendole que acepte cualquier tipo de dato:
let list:any=8; list='Hola'; list=false; let objeto:any[]=[1,true,"Hola"];
Suscribirse a:
Entradas
(
Atom
)
No hay comentarios :
Publicar un comentario