Scribd
Upload
6 views4 pages

Angular

Uploaded by

aditya

Copyright:

© All Rights Reserved
Download as DOCX, PDF, TXT or read online from Scribd
Download as docx, pdf, or txt

Angular

Uploaded by

aditya
6 views4 pages

Original Title

angular

Copyright

© © All Rights Reserved

Available Formats

DOCX, PDF, TXT or read online from Scribd

Did you find this document useful?

Is this content inappropriate?

Copyright:

© All Rights Reserved
Download as DOCX, PDF, TXT or read online from Scribd
Download as docx, pdf, or txt
6 views4 pages

Angular

Uploaded by

aditya

Copyright:

© All Rights Reserved
Download as DOCX, PDF, TXT or read online from Scribd
Download as docx, pdf, or txt
You are on page 1/ 4

12.

Angular Under the Hood

------------------------------

Angular.json

here we set some configurations for the angular application itself

if we are serving for diff environments , we can specify specific configurations right here

holds info about angular projects and some more configurations

package.json

this one related to npde js or npm , contains all the dependencies

.gitignore

all files that are ignored by version control system like git

node_modules

inside this folder we have all of our packages and dependencies

,not only link to it but the real packages with all of its content

src

now the most important folder is the source folder , src

we are working here most of time

index.html

this is the main page/home page

and here we are injecting the <app-root> (this is selector )

the cli has created one component ,

our application has one main component app-component,

components are the building blocks , we can have many components


this is your first component that autometically gets created

you can see this indicated by the decorator here,

-------------------------------------------------------

import { Component } from '@angular

@Component({

selector: 'app-root',

templateUrl: './app.component.html',

styleUrls: ['./app.component.css']

})

export class AppComponent {

title = 'appointment-app';

@Component

it is turning this class into a component

index.html

------------

..

<app-root>

..

above shows that inside this we want to show app-root component

goes to app.component.ts(associated to this)

inside of this app.component.ts ,we can see the selector for this
component here for this is called app-root( selector: 'app-root')

associated to this we got app.component.html

and related styling is app.component.css

app.component.spec.ts - for testing

13. Components

----------------

Components are the main building block of the application

so when you are adding a new functionality to the application, chances are high that you will add

a new coponent to the application

for example if you have invoice managent system

------------------------------------------------

you have some component for mnagaing invoices,

and then you want to add some users later on , you probably will add a new component to manage
users,

we have already dicovered out first component, it will autometicaly get created , when you do ng
new

one-way Binding

------------------------

@Component({…})

Export class MyComponent{

Message = ‘Hello World’

Template(html);
{{ message }}

14. Creating the appointment list component


-------------------------------------------------------------
ng g component appointment-list

A component is declared inside of a single module

16. One-way data binding


--------------------------------------

You might also like