• Jobs
  • About Us
  • professionals
    • Home
    • Jobs
    • Courses and challenges
  • business
    • Home
    • Post vacancy
    • Our process
    • Pricing
    • Assessments
    • Payroll
    • Blog
    • Sales
    • Salary Calculator

0

115
Views
Entrada angular de 12 componentes sin valor

Esta publicación está relacionada con: Entrada angular de 2 componentes sin valor

Me gustaría lograr un componente de tarjeta con un atributo de entrada booleano llamado scrollable .

  1. <card>...</card> sin el atributo desplazable da como resultado false en el controlador
  2. <card [scrollable]>...</card> con solo el atributo desplazable da como resultado true

Ya probé la solución aceptada en la publicación vinculada.

Stackblitz: https://stackblitz.com/edit/angular-ivy-ylsxzm?file=src/app/app.component.html


Actualizar

Para resolver el problema, solo tuve que eliminar los corchetes del atributo Desplazable.

Stackblitz bifurcado: https://stackblitz.com/edit/angular-ivy-s6d8ag?file=src/app/app.component.html

about 3 years ago · Santiago Trujillo
1 answers
Answer question

0

Cambie su card.component.ts así:

 export class CardComponent { constructor() {} ngOnInit() { if (!this._scrollable) this._scrollable = false; console.log(this._scrollable); } public _scrollable: boolean; @Input() get scrollable() { return this._scrollable; } set scrollable(value: any) { this._scrollable = this.coerceBooleanProperty(value); } coerceBooleanProperty(value: any): boolean { return value != null && `${value}` !== 'false'; } }

Ahora, puedes usarlo así:

 <card></card> // _scrollable = false <card scrollable></card> // _scrollable = true

Tenga en cuenta que puede usar scrollable sin [] , ya que es un valor booleano y su valor predeterminado es true . También puede usarlo con [] pero tendría que pasar la expresión (o la propiedad del componente) que resultará a Boolean.

 <card [scrollable] = "false"></card> // _scrollable = false <card [scrollable] = "true"></card> // _scrollable = true

ejemplo de trabajo

about 3 years ago · Santiago Trujillo Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Our process Sales
Legal
Terms and conditions Privacy policy
© 2025 PeakU Inc. All Rights Reserved.

Andres GPT

Recommend me some offers
I have an error