Getting Started with Angular 9

栏目: IT技术 · 发布时间: 6年前

内容简介:The Angular 9.0.0 version has been released now.This is a major release and have changes for entire platform, including the framework, Angular Material, and the CLI.The Ivy compiler is default runtime compiler, Earlier it was optional parameter to select c

The Angular 9.0.0 version has been released now.This is a major release and have changes for entire platform, including the framework, Angular Material, and the CLI.

The Ivy compiler is default runtime compiler, Earlier it was optional parameter to select compiler under angular 8.They can Improved build errors that will helpful to debug errors in the application.

The angular 9 introduced two new component YouTube and Google Maps.You can include into your application and take benefit of those component.

There are following breaking changes for angular 9 –

tslib

Table of Contents

Setting up Angular CLI v

You can install angular CLI by using following command, Open CMD in Administrator mode and run the following command.

// For Mac and Linux

sudo npm install -g @angular/cli

// For Windows

npm install -g @angular/cli

Now, run the following command to check the Angular CLI version.

ng version

How To Create a New Angular 9 Project

Let’s create a simple angular 9 application.Type the following command to create the new Angular 9 project –

ng new hello-angular9

The above CLI command will ask you two –

  • Would you like to add an Angular routing? Type y for Yes , n for NO
  • which stylesheet format would you like to use? Select CSS or other.

The above option use to add routing information into your application.You don’t need to add the routes for angular components to implement navigation in our application.You ll get app-routing.module.ts file inside the src >> app directory.

How To Run Angular 9 Application

I have created angular 9 application , Let’s run angular 9 application by running below command –

ng serve --open

The "–open" parameter will automatically open this Angular 9 app in the default browser.

The default URL is: http://localhost:4200

How To install Bootstrap 4

We will install bootstrap by using following command-

npm install bootstrap --save

Add the bootstrap css file inside an angular.json file.

"styles": [
   "src/styles.css",
   "./node_modules/bootstrap/dist/css/bootstrap.min.css"
 ],

How To Create Component

The Angular 9 CLI will use to create component. Type the following command to create the new component into the project –

ng g c employee-add --skipTests=true

The above command will create following files –

CREATE src/app/employee-add/employee-add.component.css (0 bytes)
CREATE src/app/employee-add/employee-add.component.html (25 bytes)
CREATE src/app/employee-add/employee-add.component.ts (290 bytes)

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持 码农网

查看所有标签

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们

梦断代码

梦断代码

Scott Rosenberg / 韩磊 / 电子工业出版社 / 2008.06 / 49.00元

软件乃是人类自以为最有把握,实则最难掌控的技术。本书作者罗森伯格对OSAF主持的Chandler项目进行田野调查,跟踪经年,试图借由Chandler的开发过程揭示软件开发中的一些根本性大问题。. 本书是讲一事,也是讲百千事;是写一软件,也是写百千软件;是写一群人,也是写百千万人。任何一个在软件领域稍有经验的技术人员看完本书,必掩卷长叹:做软件难。...一起来看看 《梦断代码》 这本书的介绍吧!

HTML 压缩/解压工具
HTML 压缩/解压工具

在线压缩/解压 HTML 代码

UNIX 时间戳转换
UNIX 时间戳转换

UNIX 时间戳转换

HEX HSV 转换工具
HEX HSV 转换工具

HEX HSV 互换工具