injectable angular2

1. ModularComponent-based programming is a trend in web development, and ANGULAR2 provides an efficient and simple way to develop components so that program development pays more attention to the implementation of business logic, without caring about how to load components and modules, how to reference and dependency injection implementations, and so on.As shown in the following code, ANGULAR2 provides anno

JQuery makes it easier to manipulate the DOM. Due to its ease of use and scalability, Jquer also quickly swept the world, a variety of plug-ins are also dizzying.I'm sure a lot of people don't go straight from jquery to the front, because it's so easy to use, and most of what we used to do is based on jquery and its plugins. And now Angular2 's component ecology is not perfect, we may want to use jquery when writing angular. This article provides a br

I know Angular2 's idea of using jquery might see a little bit of an odd lot of you, and we all know that ANGULAR2 is responsible for managing everything related to our view components and DOM elements, which sounds like a good idea, and a working corner made with another frame can be easily done.In other words, why would anyone want jquery and ANGULAR2 integrati

A module in ANGULAR2 refers to a class that is decorated with @ngmodule. @NgModule use a metadata object to tell angular how to compile and run the code. A module can contain components, directives, pipelines, and can declare their access rights public so that the components of the external module can access and use them. module is used to organize the application, through the module mechanism external class library can be very convenient to extend t

Due to the rise of Angular2 soon, the relevant plug-ins are still very few, so sometimes have to use some jquery plug-ins to complete the project,So how do you put the jquery plugin in the angular2? Use custom directives!To introduce jquery before the context, this no longer describesFirst, create a directive that uses the @input method to get the parameters required by the jquery plugin.In Ngonchanges, whe

Log in when the login is successful, you need to put the information into a cookie, NPM install several Angular2-cookie ng2-cookies angular2-cookiesAccording to the above method, always error, method is undefined, Baidu Google no fruitFinally, one of the local storage solutions to LOCALSTORAGE,HTML5, easy to use Localstorage.setitem (' User ', Json.stringify (this.users)); This.user = Json.pars

The last to do the route part of the hero, there is a URL problem, this time I follow the tutorial inside the vs2015 integrated way to find styleurls: ['./app/app.component.css '] This time can not find, to replace styleurls: [' App.component.css '] .... Are you kidding me? Maybe it's because the file location of ' My-app ' has changed.This does not matter, this time mainly writes the IFRAME question.Vs inside built such a homepageThen My-app element in the Welcome page inside, run, en, page out

Preface Small series recently in the front-end engineering work, using the ANGULAR2 front-end framework for the project front-end interface reconstruction. And then for the ANGULAR2 project operating principles have some new experience, here and June mutual encouragement. Body ANGULAR2 directory Structure Development Create a new folder HelloWorld mkdir HelloW

ANGULAR2 's dependency injection contains too much content, one of the key points is the injector, and the injector is very difficult to understand, today we do not delve into the contents of the injector, we can refer to the official documentation, we are today the level of the injector. That is, the container in which the component gets the service chooses which one to specify. Let's briefly introduce a background: There are 3 components appcompon

NG2 component Communication in work the official documentation is concise and I understand that after finishingRxjs do not understand this article is very detailed http://www.open-open.com/lib/view/open1462525661610.htmlHere is the service code1Import {injectable} from ' @angular/core ';2Import {subject}from "Rxjs/subject";3 @Injectable ()4 Export class Cservice {5Private Outputtitle =NewSubject ();6 //Su

tests, you should create your service (new), because my basedataservice is not dependent on the angular di system to generate it.Service = new Basedataservice (config, HTTP); When the sino-list is used as a Sino-base-data-servie subassembly, the service in the parent component is acquired, so the unit test becomes much better after this is written. Dependency Injection method for service dependent on di system It is through the encapsulation of the module, inject basedataservice into the angula

First, the display injection device Injector = Reflectiveinjector.resolveandcreate ([Car, Engine, Tires]); Let car = injector.get (car);Second, a single case serviceIn the scope of an injector, the dependencies are singleton, because they share a service instanceThree, multi-example serviceAngular di is a layered dependency injection system, which means that nested injectors can create their own service instances.Iv. Role of @injectabledIdentifies a class that can be instantiated by an injecto

Shadowdom-Encapsulating private stylesANGULAR2 uses shadowdom as the rendering basis for the component, which means that the component is rendered to a separate shadow tree, which is good for good encapsulation of DOM objects and styles:The problem is that most browsers, except for Chrome, do not currently support Shadowdom, so ANGULAR2 provides three strategies for rendering templates to the DOM.Taking the following template as an example, we look at

OverviewANGULAR2 's official recommendation should be to use SYSTEMJS to load, but when I use the tree shaking, I find that if I use Systemjs+rollup, I can only package it into one file, and then lazy loading can't do it.So I used webpack2,webpack2 with the tree shaking, as long as the Tsconfig in the module set to es2015, although the effect is not rollup good, but support lazy loading.In addition, ANGULAR2 currently does not support typescript 2.1.X

If you have seen Angular2 's official website, you should know that you can quickly build a angular project with CLI tools, install node. js and NPM before installing the CLI, and node. JS has a version of 6.9.0 or more, NPM should be above 3.0.0.My node. js and NPM were installed successfully, but always made an error while installing ANGULAR/CLI, and later knew that node. JS had to install the 6.9.4 version.Before installing node. js, if you do not

This article mainly introduces how to judge the results of the validator. Here, let's look at how to implement a custom validator. Goal We want to implement a verification of the phone number of the validator, the use of the example or based on the previous article inside the example, that is, the user information entered the form page. We add a validator that verifies the phone number on the element of the cell phone number. Then, if the phone number verification fails, an error is displayed,

Detailed description of the. Net Core + Angular2 environment, coreangular2 This article describes how to set up the. Net Core + Angular2 environment, as follows: Environment setup: 1) node. js version> 5.0, NPM version> 3.0, TypeScript version> 2.0 (the latest version is enough) 2) install NTVS 1.2 (node tools for vs) and TSVS dev 1.4 (TS for) 3) construct the package. json, tsconfig. json, and gulp. js fil

On the internet to find a lot of textbooks are not search for this part of the type, self-test to write the tutorial.Scenario Description: The project needs to use bootstrap, it is well known that Bootstrap has no time-date control, need to use a third-party control, I am afraid of how to use third-party controls in Angular2, my project uses ANGULAR-CLI build.Resolution 1: Configure Package.json to add a new dependency, then update to download the new

Why original: Hui Zhi networkAngular1.x obviously very successful, then, why do we have to turn violently to Angular2? Limitations of performanceAngularjs was originally an internal tool for designers to quickly build HTML forms. Over time, various features are added to suit the development of applications in different scenarios. However, due to the initial architectural constraints (such as bindings and templating mechanisms), performance improveme

#var-Local variablesSometimes different elements in the template may need to be called each other, and ANGULAR2 provides a simple syntax for mapping elements to local variables: Adding a property that begins with a # or var-, followed by a section representing the variable name, and an instance of the variable corresponding to the element.In the following code example, we define a local variable v_h1 for the element H1, which points to the DOM object