injectable angular2

HTML>HTML> Head> MetaCharSet=utf-8> Metaname= "Viewport"content= "Width=device-width, initial-scale=1"> title>Hello, Angular2.title> Head> Body> My-app>Loading ...My-app> Scriptsrc= "./bundle.js">Script> Body>HTML>is a my-app tag, in Angular 2, we can customize the mark, this My-app is our application after the stage of performance.A simpler paragraph of the script is to directly reference the script we are going to generate.4. Cre

param1 by using the following code:Import {Component, OnInit}From' @angular/core ';import {Router, Activatedroute, Params} from ' @angular/router '; @Component ({selector: templateurl: './abc.html ', styleUrls: [export class abccomponent implements oninit {constructor (Private Route:activatedroute) {} ngOnInit () { Span class= "hljs-comment" >//get param let param1 = This.route.snapshot.queryparams[ "param1"];}} Fifth scenarioFirst, I found that using

Resolution 1: Configure Package.json to add a new dependency, then update to download the new library "jquery": "*", "tether": "*", "bootstrap": "*", "moment": "*", " Eonasdan-bootstrap-datetimepicker ":" * "2: Configure Angular-cli.json" Styles ": ["]. /node_modules/bootstrap/dist/css/bootstrap.min.css ",". /node_modules/eonasdan-bootstrap-datetimepicker/build/css/bootstrap-datetimepicker.min.css "," Styles.css "]," Scripts ": ["]. /node_modules/jquery/dist/jquery.min.js ",". /node_modules/teth

It wasn't until a year ago that I didn't think I'd write a book, until two or three years ago I wouldn't have thought of putting my spare time on a writing (technical blog). At the beginning, I just wanted to summarize the problems I encountered in my work and publish them in my blog for future reference. Do not want to get everyone's approval, so more intentions to maintain, update their blog.Recently joined the new project team is responsible for front-end technology pre-research and selection

Learn how to create a custom validator to check whether passwords match.H1>Password matchH1>formnovalidate AutoComplete= "Off"[Formgroup]= "Signupform"> Divclass= "Form-field"> label>Password:label> inputtype= "text"Formcontrolname= "Password"[(Ngmodel)]= "Signup.password"name= "Password"> Div> Divclass= "Form-field"> label>Confirm Password:label> inputtype= "text"Formcontrolname= "Confirm"[(Ngmodel)]= "Signup.confirm"name= "Confrim">Div>form> this. Signupform = fb.group ({

By learning these concepts, you can simply describe a tab button for an option feature:Data:1. Arrays:Instantiate a class of an array, if you want to use the data in this class, you need to use a public property in the component to storm the class such as heroes=heroes;Const Array Name heroes: Data structure in array =[]Command instructions1.*ngfor= "Let value of Arr/json" ==> {{value}}2. (click) = function name (parameter)Module template syntax for angular: https://www.angular.cn/docs/ts/latest

-of]= "items" #item = "" #i = "index">2 [{{i+1}}] {{item}} 3 Now the resulting results are more disciplined:1 2 3 Grammar sugarSimilar to Ngif, ANGULAR2 also provides two syntactic sugars for ngfor:1 // using template attribute 2 template= "ng-for #item of items; #i =index">...3// Use the * prefix 4 *ng-for= "#item of items; #i =index">...There is no doubt that you should try to use *ng-for 's simple notation, which can improve the readability of

Angular2: about * ngFor nested loop, angular2ngfor The data obtained in the project development should be traversed cyclically. However, in ng2, it seems that the Object cannot be traversed directly. datas: any = [ { num: 1, date: "2017-04-12", sellNum: "1231234", sellMpney: "1233", returnNum: "24"}, { num: 1, date: "2017-04-12", sellNum: "1231234", sellMpney: "1233", returnNum: "24"}, { num: 1, date: "2017-04-12", sellNum: "1231234", sellMpney: "

ANGULAR2 has two of the more useful upload files of the third-party library, one is ng2-file-upload , one is ng2-uploader . ng2-uploaderis a lightweight upload file support library, the function is weak, but ng2-file-upload is a feature more comprehensive upload file support library. Here ng2-file-upload is the main introduction of the use.The following are described in the Mac OS operating system.1. InstallationInstall with NPM. To open terminal in t

return an array of routing links. The router will eventually parse the array into a URL and a component view. We can also add a routerlinkactive directive to Appcomponent templates Template: ' 6. Router Status At the end of each navigation lifecycle, the router builds a activatedroute tree that represents the current state of the router. We can access the current Routerstate value in any application using the router service and its routerstate properties. 7.router_directives

The purpose of the angular module is to organize the logical structure of the app. The class used by @ngmodule in Ng is considered to be a NG module. Ngmodule can manage components, directives, pipes within the module, introduce service, and control the access of external components to internal members. ANGULAR2 has the concept of the module, and responds to the call of the backstage program, cohesion well-structured classes the low coupling. Module

component, app.component.ts, is just a container. Import {Component} from ' @angular/core '; @Component ({ selector: ' App-root ', templateurl: './app.component.html ' }) Export class appcomponent { } Implementation of bidirectional binding twoway-bind.component.ts: Import {Component, OnInit} from ' @angular/core '; @Component ({ selector: ' App-twoway-bind ', Template: ' Note that the above [(Ngmodel)] This writing, () represents the output, [] represents the input, th

() { this.info=student; } HTML: In property bindings, a value is passed from the model to the target property on the screen. We mark the target property by enclosing the name in square brackets, []. This is a one-way data binding from the model to the view. In event bindings, values are passed from the target property on the screen to the model. We mark the target attribute by enclosing the name in parentheses, (). This is a reverse one-way data binding from view to model. When the bindi

Attribute declarations-Exposing member variablesA property is a calling interface that a component exposes to the outside world, and the caller customizes the behavior and appearance of the component by setting different property values:Adding a property interface to a component in ANGULAR2 is straightforward, just declare the member variable of the component in the Properties property of the Component annotation:1 // 2@Component ({3 properties:[