CODEWITHSUNDEEP
javascripttypescriptangular2-templateangular2-forms
kkom
kkom

Reputation: 39

How to display the data in template

I am new to Angular2.

sample.html

<label>Name:</label>
<input type="text" [(ngModel)]="yourName" placeholder="Enter a name here">


<button (click)="sendData(yourName)">send data</button>
<p>{{receivedData}}</p>

sample.ts

import {Component} from 'angular2/core';

@Component({
selector: 'hello-world',
templateUrl: 'src/hello_world.html'
})
export class HelloWorld {
yourName: string = '';
receviedData : string = "";
console.log(receivedData);
sendData(yourName) : void{
console.log("sent",yourName);
receivedData = yourName;

}

}

I am trying to send the data as a input to the sendata function, then assign it to the receivedData variable and then display receivedData variable in template using interpolation.

 I appreciate any help related to this.

 Thanks

Upvotes: 0

Views: 24

Answers (1)

Ali
Ali

Reputation: 121

You are almost there. You need to make a change in your component ts file. You are using following:

receivedData = yourName;

However, you need to use following:

this.receivedData = yourName;

first one try to assign value to a local variable, but answer assign the value to global variable.

Hope this helps.

Upvotes: 1

Related Questions