Created
November 6, 2019 06:31
-
-
Save mfsiat/e101c819d6021417d64c0f7cb3898df4 to your computer and use it in GitHub Desktop.
How to declare types for properties and how to call methods from the html files
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import { BrowserModule } from '@angular/platform-browser'; | |
import { NgModule } from '@angular/core'; | |
import { AppComponent } from './app.component'; | |
import { UserComponet } from './components/user/user.component'; | |
@NgModule({ | |
declarations: [ | |
AppComponent, | |
UserComponet | |
], | |
imports: [ | |
BrowserModule | |
], | |
providers: [], | |
bootstrap: [AppComponent] | |
}) | |
export class AppModule { } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!-- <h2>John Doe</h2> --> | |
<!-- String interpolation --> | |
<h2>{{ firstName }} {{ lastName }}</h2> | |
<ul> | |
<li>Age: {{ showAge() }}</li> | |
<li>Address: {{ address.street }}, {{ address.city }}, {{ address.country }}</li> | |
</ul> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import { Component } from "@angular/core"; | |
@Component({ | |
selector: "app-user", | |
templateUrl: "./user.component.html", | |
styleUrls: ["./user.component.css"] | |
}) | |
export class UserComponet { | |
firstName : string; // using types and calling from constructor | |
lastName : string; | |
age : number; | |
address; | |
// Methods | |
constructor() { | |
// Using Types | |
this.firstName = 'Nasirul'; | |
this.lastName = 'Islam'; | |
this.age = 24; | |
this.address = { | |
street: '214/B', | |
city: 'Dhaka', | |
country: 'Bangladesh' | |
} | |
} | |
// we can also use methods for string interpolation | |
showAge() { | |
return this.age+2; | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment