(function webpackUniversalModuleDefinition(root, factory) { if(typeof exports === 'object' && typeof module === 'object') module.exports = factory(require("Rx"), require("rxjs/operator/toPromise")); else if(typeof define === 'function' && define.amd) define(["Rx", "rxjs/operator/toPromise"], factory); else if(typeof exports === 'object') exports["ng"] = factory(require("Rx"), require("rxjs/operator/toPromise")); else root["ng"] = factory(root["Rx"], root["Rx"]["Observable"]["prototype"]); })(this, function(__WEBPACK_EXTERNAL_MODULE_50__, __WEBPACK_EXTERNAL_MODULE_66__) { return /******/ (function(modules) { // webpackBootstrap /******/ // The module cache /******/ var installedModules = {}; /******/ // The require function /******/ function __webpack_require__(moduleId) { /******/ // Check if module is in cache /******/ if(installedModules[moduleId]) /******/ return installedModules[moduleId].exports; /******/ // Create a new module (and put it into the cache) /******/ var module = installedModules[moduleId] = { /******/ exports: {}, /******/ id: moduleId, /******/ loaded: false /******/ }; /******/ // Execute the module function /******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__); /******/ // Flag the module as loaded /******/ module.loaded = true; /******/ // Return the exports of the module /******/ return module.exports; /******/ } /******/ // expose the modules object (__webpack_modules__) /******/ __webpack_require__.m = modules; /******/ // expose the module cache /******/ __webpack_require__.c = installedModules; /******/ // __webpack_public_path__ /******/ __webpack_require__.p = ""; /******/ // Load entry module and return exports /******/ return __webpack_require__(0); /******/ }) /************************************************************************/ /******/ ([ /* 0 */ /***/ function(module, exports, __webpack_require__) { module.exports = __webpack_require__(1); /***/ }, /* 1 */ /***/ function(module, exports, __webpack_require__) { exports.core = __webpack_require__(2); exports.common = __webpack_require__(112); exports.compiler = __webpack_require__(161); exports.platform = { browser: __webpack_require__(195), common_dom: __webpack_require__(218) }; exports.http = __webpack_require__(226); exports.router = __webpack_require__(241); exports.router_link_dsl = __webpack_require__(271); exports.instrumentation = __webpack_require__(273); exports.upgrade = __webpack_require__(274); /***/ }, /* 2 */ /***/ function(module, exports, __webpack_require__) { function __export(m) { for (var p in m) if (!exports.hasOwnProperty(p)) exports[p] = m[p]; } /** * @module * @description * Starting point to import all public core APIs. */ __export(__webpack_require__(3)); __export(__webpack_require__(76)); __export(__webpack_require__(77)); __export(__webpack_require__(6)); __export(__webpack_require__(78)); var lang_1 = __webpack_require__(5); exports.enableProdMode = lang_1.enableProdMode; var application_ref_1 = __webpack_require__(79); exports.platform = application_ref_1.platform; exports.createNgZone = application_ref_1.createNgZone; exports.PlatformRef = application_ref_1.PlatformRef; exports.ApplicationRef = application_ref_1.ApplicationRef; var application_tokens_1 = __webpack_require__(82); exports.APP_ID = application_tokens_1.APP_ID; exports.APP_COMPONENT = application_tokens_1.APP_COMPONENT; exports.APP_INITIALIZER = application_tokens_1.APP_INITIALIZER; exports.PACKAGE_ROOT_URL = application_tokens_1.PACKAGE_ROOT_URL; exports.PLATFORM_INITIALIZER = application_tokens_1.PLATFORM_INITIALIZER; __export(__webpack_require__(101)); __export(__webpack_require__(102)); __export(__webpack_require__(103)); var debug_node_1 = __webpack_require__(106); exports.DebugElement = debug_node_1.DebugElement; exports.DebugNode = debug_node_1.DebugNode; exports.asNativeElements = debug_node_1.asNativeElements; __export(__webpack_require__(83)); __export(__webpack_require__(25)); __export(__webpack_require__(107)); __export(__webpack_require__(108)); __export(__webpack_require__(109)); __export(__webpack_require__(17)); /***/ }, /* 3 */ /***/ function(module, exports, __webpack_require__) { /** * This indirection is needed to free up Component, etc symbols in the public API * to be used by the decorator versions of these annotations. */ var di_1 = __webpack_require__(4); exports.QueryMetadata = di_1.QueryMetadata; exports.ContentChildrenMetadata = di_1.ContentChildrenMetadata; exports.ContentChildMetadata = di_1.ContentChildMetadata; exports.ViewChildrenMetadata = di_1.ViewChildrenMetadata; exports.ViewQueryMetadata = di_1.ViewQueryMetadata; exports.ViewChildMetadata = di_1.ViewChildMetadata; exports.AttributeMetadata = di_1.AttributeMetadata; var directives_1 = __webpack_require__(24); exports.ComponentMetadata = directives_1.ComponentMetadata; exports.DirectiveMetadata = directives_1.DirectiveMetadata; exports.PipeMetadata = directives_1.PipeMetadata; exports.InputMetadata = directives_1.InputMetadata; exports.OutputMetadata = directives_1.OutputMetadata; exports.HostBindingMetadata = directives_1.HostBindingMetadata; exports.HostListenerMetadata = directives_1.HostListenerMetadata; var view_1 = __webpack_require__(75); exports.ViewMetadata = view_1.ViewMetadata; exports.ViewEncapsulation = view_1.ViewEncapsulation; var di_2 = __webpack_require__(4); var directives_2 = __webpack_require__(24); var view_2 = __webpack_require__(75); var decorators_1 = __webpack_require__(9); // TODO(alexeagle): remove the duplication of this doc. It is copied from ComponentMetadata. /** * Declare reusable UI building blocks for an application. * * Each Angular component requires a single `@Component` annotation. The `@Component` * annotation specifies when a component is instantiated, and which properties and hostListeners it * binds to. * * When a component is instantiated, Angular * - creates a shadow DOM for the component. * - loads the selected template into the shadow DOM. * - creates all the injectable objects configured with `providers` and `viewProviders`. * * All template expressions and statements are then evaluated against the component instance. * * ## Lifecycle hooks * * When the component class implements some {@link angular2/lifecycle_hooks} the callbacks are * called by the change detection at defined points in time during the life of the component. * * ### Example * * {@example core/ts/metadata/metadata.ts region='component'} */ exports.Component = decorators_1.makeDecorator(directives_2.ComponentMetadata, function (fn) { return fn.View = View; }); // TODO(alexeagle): remove the duplication of this doc. It is copied from DirectiveMetadata. /** * Directives allow you to attach behavior to elements in the DOM. * * {@link DirectiveMetadata}s with an embedded view are called {@link ComponentMetadata}s. * * A directive consists of a single directive annotation and a controller class. When the * directive's `selector` matches * elements in the DOM, the following steps occur: * * 1. For each directive, the `ElementInjector` attempts to resolve the directive's constructor * arguments. * 2. Angular instantiates directives for each matched element using `ElementInjector` in a * depth-first order, * as declared in the HTML. * * ## Understanding How Injection Works * * There are three stages of injection resolution. * - *Pre-existing Injectors*: * - The terminal {@link Injector} cannot resolve dependencies. It either throws an error or, if * the dependency was * specified as `@Optional`, returns `null`. * - The platform injector resolves browser singleton resources, such as: cookies, title, * location, and others. * - *Component Injectors*: Each component instance has its own {@link Injector}, and they follow * the same parent-child hierarchy * as the component instances in the DOM. * - *Element Injectors*: Each component instance has a Shadow DOM. Within the Shadow DOM each * element has an `ElementInjector` * which follow the same parent-child hierarchy as the DOM elements themselves. * * When a template is instantiated, it also must instantiate the corresponding directives in a * depth-first order. The * current `ElementInjector` resolves the constructor dependencies for each directive. * * Angular then resolves dependencies as follows, according to the order in which they appear in the * {@link ViewMetadata}: * * 1. Dependencies on the current element * 2. Dependencies on element injectors and their parents until it encounters a Shadow DOM boundary * 3. Dependencies on component injectors and their parents until it encounters the root component * 4. Dependencies on pre-existing injectors * * * The `ElementInjector` can inject other directives, element-specific special objects, or it can * delegate to the parent * injector. * * To inject other directives, declare the constructor parameter as: * - `directive:DirectiveType`: a directive on the current element only * - `@Host() directive:DirectiveType`: any directive that matches the type between the current * element and the * Shadow DOM root. * - `@Query(DirectiveType) query:QueryList`: A live collection of direct child * directives. * - `@QueryDescendants(DirectiveType) query:QueryList`: A live collection of any * child directives. * * To inject element-specific special objects, declare the constructor parameter as: * - `element: ElementRef` to obtain a reference to logical element in the view. * - `viewContainer: ViewContainerRef` to control child template instantiation, for * {@link DirectiveMetadata} directives only * - `bindingPropagation: BindingPropagation` to control change detection in a more granular way. * * ### Example * * The following example demonstrates how dependency injection resolves constructor arguments in * practice. * * * Assume this HTML template: * * ``` *
*
*
*
*
*
*
*
*
*
* ``` * * With the following `dependency` decorator and `SomeService` injectable class. * * ``` * @Injectable() * class SomeService { * } * * @Directive({ * selector: '[dependency]', * inputs: [ * 'id: dependency' * ] * }) * class Dependency { * id:string; * } * ``` * * Let's step through the different ways in which `MyDirective` could be declared... * * * ### No injection * * Here the constructor is declared with no arguments, therefore nothing is injected into * `MyDirective`. * * ``` * @Directive({ selector: '[my-directive]' }) * class MyDirective { * constructor() { * } * } * ``` * * This directive would be instantiated with no dependencies. * * * ### Component-level injection * * Directives can inject any injectable instance from the closest component injector or any of its * parents. * * Here, the constructor declares a parameter, `someService`, and injects the `SomeService` type * from the parent * component's injector. * ``` * @Directive({ selector: '[my-directive]' }) * class MyDirective { * constructor(someService: SomeService) { * } * } * ``` * * This directive would be instantiated with a dependency on `SomeService`. * * * ### Injecting a directive from the current element * * Directives can inject other directives declared on the current element. * * ``` * @Directive({ selector: '[my-directive]' }) * class MyDirective { * constructor(dependency: Dependency) { * expect(dependency.id).toEqual(3); * } * } * ``` * This directive would be instantiated with `Dependency` declared at the same element, in this case * `dependency="3"`. * * ### Injecting a directive from any ancestor elements * * Directives can inject other directives declared on any ancestor element (in the current Shadow * DOM), i.e. on the current element, the * parent element, or its parents. * ``` * @Directive({ selector: '[my-directive]' }) * class MyDirective { * constructor(@Host() dependency: Dependency) { * expect(dependency.id).toEqual(2); * } * } * ``` * * `@Host` checks the current element, the parent, as well as its parents recursively. If * `dependency="2"` didn't * exist on the direct parent, this injection would * have returned * `dependency="1"`. * * * ### Injecting a live collection of direct child directives * * * A directive can also query for other child directives. Since parent directives are instantiated * before child directives, a directive can't simply inject the list of child directives. Instead, * the directive injects a {@link QueryList}, which updates its contents as children are added, * removed, or moved by a directive that uses a {@link ViewContainerRef} such as a `ngFor`, an * `ngIf`, or an `ngSwitch`. * * ``` * @Directive({ selector: '[my-directive]' }) * class MyDirective { * constructor(@Query(Dependency) dependencies:QueryList) { * } * } * ``` * * This directive would be instantiated with a {@link QueryList} which contains `Dependency` 4 and * 6. Here, `Dependency` 5 would not be included, because it is not a direct child. * * ### Injecting a live collection of descendant directives * * By passing the descendant flag to `@Query` above, we can include the children of the child * elements. * * ``` * @Directive({ selector: '[my-directive]' }) * class MyDirective { * constructor(@Query(Dependency, {descendants: true}) dependencies:QueryList) { * } * } * ``` * * This directive would be instantiated with a Query which would contain `Dependency` 4, 5 and 6. * * ### Optional injection * * The normal behavior of directives is to return an error when a specified dependency cannot be * resolved. If you * would like to inject `null` on unresolved dependency instead, you can annotate that dependency * with `@Optional()`. * This explicitly permits the author of a template to treat some of the surrounding directives as * optional. * * ``` * @Directive({ selector: '[my-directive]' }) * class MyDirective { * constructor(@Optional() dependency:Dependency) { * } * } * ``` * * This directive would be instantiated with a `Dependency` directive found on the current element. * If none can be * found, the injector supplies `null` instead of throwing an error. * * ### Example * * Here we use a decorator directive to simply define basic tool-tip behavior. * * ``` * @Directive({ * selector: '[tooltip]', * inputs: [ * 'text: tooltip' * ], * host: { * '(mouseenter)': 'onMouseEnter()', * '(mouseleave)': 'onMouseLeave()' * } * }) * class Tooltip{ * text:string; * overlay:Overlay; // NOT YET IMPLEMENTED * overlayManager:OverlayManager; // NOT YET IMPLEMENTED * * constructor(overlayManager:OverlayManager) { * this.overlay = overlay; * } * * onMouseEnter() { * // exact signature to be determined * this.overlay = this.overlayManager.open(text, ...); * } * * onMouseLeave() { * this.overlay.close(); * this.overlay = null; * } * } * ``` * In our HTML template, we can then add this behavior to a `
` or any other element with the * `tooltip` selector, * like so: * * ``` *
* ``` * * Directives can also control the instantiation, destruction, and positioning of inline template * elements: * * A directive uses a {@link ViewContainerRef} to instantiate, insert, move, and destroy views at * runtime. * The {@link ViewContainerRef} is created as a result of `