Installation and use of Angular 2 (Ubuntu15.04)

Angular 2 ready to install before installation dependent (g++, Libssl-dev)

Before installing node. js, if you do not have g++ and Libssl-dev installed, follow these steps to install:

sudo apt-get install g++sudo apt-get Install

Installing Nodejs

Older versions produce errors, but newer versions are normal.

The next step is to install node. JS:

mkdir toolscd tools/wget Https://nodejs.org/dist/v7.10.0/node-v7.10.0-linux-x64.tar.xztar xvf NODE-V7.10.0-LINUX-X64.TAR.XZCD node-v7.10.0-linux-x64/

Add a soft connection

sudo ln-s/home/solin/tools/node-v7.10.0-linux-x64/bin/node/usr/local/bin/nodesudo ln-s/home/solin/tools/ node-v7.10.0-linux-x64/bin/npm/usr/local/bin/npm

This installs and the version number can be viewed at the terminal:

Node-vnpm-v

650) this.width=650; "src=" Http://s3.51cto.com/wyfs02/M00/96/E4/wKiom1kmibPDvWWpAAAEqz9jVHQ895.png "/>

Installing angular

node. js and NPM are all installed and can be installed ANGULAR2, according to the following website:

NPM install-g @angular/CLI

Create a link

sudo ln-s/home/solin/tools/node-v7.10.0-linux-x64/bin/ng/usr/local/bin/ng

View Angular version 2

Ng-v

To see if the installation was successful

650) this.width=650; "src=" Http://s3.51cto.com/wyfs02/M01/96/E4/wKiom1kmibOS8DeEAAB1lPafx-w024.png "/>

Note: If you have previously existed

NPM uninstall-g angular-cli npm Cache clean NPM install-g [email protected]

Angular simple use Create a new project

Open the terminal window.

Build a new project and framework application by running the following command:

ng New My-app

It takes time to set up new projects, and most of the time to install NPM packages.

650) this.width=650; "src=" Http://s3.51cto.com/wyfs02/M00/96/E4/wKioL1kmibTxIeWqAABStoCNsUk891.png "/>

Start the service

Go to the project directory and start the server.

CD My-app

ng serve--open

ng serve when you make changes to these files, the command starts the server, monitors your files, and re-constructs the application.

Using the --open(or just- o) option will automatically open your browser http://localhost:4200/.

Your application sends you a message:

650) this.width=650; "src=" Http://s3.51cto.com/wyfs02/M01/96/E4/wKiom1kmibTx5DIWAACaycLUK9U129.png "/>

Edit your first angular component

The Angular CLI creates the first Angular component for you. This is the root component, which is named App-root. You can find it in./src/app/app.component.ts.

Open the component file and change the title Property app works! For My first Angular App:

# src/app/app.component.tsexportclassappcomponent {title = ' My first Angular app ';}

The browser will automatically reload the revised title.

650) this.width=650; "src=" Http://s3.51cto.com/wyfs02/M01/96/E4/wKioL1kmibWQoNdhAACcallMjjw500.png "/>

Optimizing components

Open src/app/app.component.css and give the component some style.

# src/app/app.component.cssh1 {color: #369;  Font-family:arial, Helvetica, Sans-serif; font-size:250%;}

650) this.width=650; "src=" Http://s3.51cto.com/wyfs02/M01/96/E4/wKioL1kmibXgzLaqAAC_hsVt-dk542.png "/>

650) this.width=650; "src=" Http://s3.51cto.com/wyfs02/M02/96/E4/wKiom1kmibbQnc4PAADCWGNCPCs380.png "/>

Reference Documentation: Nodejs Official information: https://nodejs.org/en/download/current/ Angular official website information: https://cli.angular.io/

This article is from the "Ops Little Boss" blog, please be sure to keep this source http://solin.blog.51cto.com/11319413/1929436

Installation and use of Angular 2 (Ubuntu15.04)