Home > Software engineering >  Angular - Make a text clickable and pass the value back to page and resubmit
Angular - Make a text clickable and pass the value back to page and resubmit

Time:10-23

Have a page which has a submit button. The value of it is taken and API is called to display some text (code is showing static example - Name). What I want to do is

  1. Make that text (Name) clickable
  2. When clicked, it passes that value back to the textbox on top and submits it again which will call the API and pass a different result (Name2 in example)

Example code: https://stackblitz.com/edit/angular-ivy-3zshve?file=src/app/app.component.ts

CodePudding user response:

  1. If you want to make the text (name) clikable, you can just add an event binding (click)="method()" to your to catch the click.

  2. An easy and better way to do that is to create an second method that only have the responsibility to change the textbox value by the value of your first response.

Bonus : you can change the mouse cursor when it's moving over the text (name) by using the css property cursor:pointer.

Here all that applied to your example : https://stackblitz.com/edit/angular-ivy-mcbfmd?file=src/app/app.component.ts

  • Related