4a740f23a4
BREAKING CHANGE: previously deprecated @Component.directives and @Component.pipes support was removed. All the components and pipes now must be declarated via an NgModule. NgModule is the basic compilation block passed into the Angular compiler via Compiler#compileModuleSync or #compileModuleAsync. Because of this change, the Compiler#compileComponentAsync and #compileComponentSync were removed as well - any code doing compilation should compile module instead using the apis mentioned above. Lastly, since modules are the basic compilation unit, the ngUpgrade module was modified to always require an NgModule to be passed into the UpgradeAdapter's constructor - previously this was optional.
137 lines
3.7 KiB
TypeScript
137 lines
3.7 KiB
TypeScript
/**
|
|
* @license
|
|
* Copyright Google Inc. All Rights Reserved.
|
|
*
|
|
* Use of this source code is governed by an MIT-style license that can be
|
|
* found in the LICENSE file at https://angular.io/license
|
|
*/
|
|
|
|
import {AnimationEntryMetadata} from '../animation/metadata';
|
|
import {Type} from '../type';
|
|
|
|
|
|
/**
|
|
* Defines template and style encapsulation options available for Component's {@link Component}.
|
|
*
|
|
* See {@link ViewMetadata#encapsulation}.
|
|
* @stable
|
|
*/
|
|
export enum ViewEncapsulation {
|
|
/**
|
|
* Emulate `Native` scoping of styles by adding an attribute containing surrogate id to the Host
|
|
* Element and pre-processing the style rules provided via
|
|
* {@link ViewMetadata#styles} or {@link ViewMetadata#stylesUrls}, and adding the new Host Element
|
|
* attribute to all selectors.
|
|
*
|
|
* This is the default option.
|
|
*/
|
|
Emulated,
|
|
/**
|
|
* Use the native encapsulation mechanism of the renderer.
|
|
*
|
|
* For the DOM this means using [Shadow DOM](https://w3c.github.io/webcomponents/spec/shadow/) and
|
|
* creating a ShadowRoot for Component's Host Element.
|
|
*/
|
|
Native,
|
|
/**
|
|
* Don't provide any template or style encapsulation.
|
|
*/
|
|
None
|
|
}
|
|
|
|
export var VIEW_ENCAPSULATION_VALUES =
|
|
[ViewEncapsulation.Emulated, ViewEncapsulation.Native, ViewEncapsulation.None];
|
|
|
|
|
|
/**
|
|
* Metadata properties available for configuring Views.
|
|
*
|
|
* Each Angular component requires a single `@Component` and at least one `@View` annotation. The
|
|
* `@View` annotation specifies the HTML template to use, and lists the directives that are active
|
|
* within the template.
|
|
*
|
|
* When a component is instantiated, the template is loaded into the component's shadow root, and
|
|
* the expressions and statements in the template are evaluated against the component.
|
|
*
|
|
* For details on the `@Component` annotation, see {@link ComponentMetadata}.
|
|
*
|
|
* ### Example
|
|
*
|
|
* ```
|
|
* @Component({
|
|
* selector: 'greet',
|
|
* template: 'Hello {{name}}!',
|
|
* directives: [GreetUser, Bold]
|
|
* })
|
|
* class Greet {
|
|
* name: string;
|
|
*
|
|
* constructor() {
|
|
* this.name = 'World';
|
|
* }
|
|
* }
|
|
* ```
|
|
*
|
|
* @deprecated Use ComponentMetadata instead.
|
|
*/
|
|
export class ViewMetadata {
|
|
/**
|
|
* Specifies a template URL for an Angular component.
|
|
*
|
|
* NOTE: Only one of `templateUrl` or `template` can be defined per View.
|
|
*
|
|
* <!-- TODO: what's the url relative to? -->
|
|
*/
|
|
templateUrl: string;
|
|
|
|
/**
|
|
* Specifies an inline template for an Angular component.
|
|
*
|
|
* NOTE: Only one of `templateUrl` or `template` can be defined per View.
|
|
*/
|
|
template: string;
|
|
|
|
/**
|
|
* Specifies stylesheet URLs for an Angular component.
|
|
*
|
|
* <!-- TODO: what's the url relative to? -->
|
|
*/
|
|
styleUrls: string[];
|
|
|
|
/**
|
|
* Specifies an inline stylesheet for an Angular component.
|
|
*/
|
|
styles: string[];
|
|
|
|
/**
|
|
* Specify how the template and the styles should be encapsulated.
|
|
* The default is {@link ViewEncapsulation#Emulated `ViewEncapsulation.Emulated`} if the view
|
|
* has styles,
|
|
* otherwise {@link ViewEncapsulation#None `ViewEncapsulation.None`}.
|
|
*/
|
|
encapsulation: ViewEncapsulation;
|
|
|
|
animations: AnimationEntryMetadata[];
|
|
|
|
interpolation: [string, string];
|
|
|
|
constructor(
|
|
{templateUrl, template, encapsulation, styles, styleUrls, animations, interpolation}: {
|
|
templateUrl?: string,
|
|
template?: string,
|
|
encapsulation?: ViewEncapsulation,
|
|
styles?: string[],
|
|
styleUrls?: string[],
|
|
animations?: AnimationEntryMetadata[],
|
|
interpolation?: [string, string]
|
|
} = {}) {
|
|
this.templateUrl = templateUrl;
|
|
this.template = template;
|
|
this.styleUrls = styleUrls;
|
|
this.styles = styles;
|
|
this.encapsulation = encapsulation;
|
|
this.animations = animations;
|
|
this.interpolation = interpolation;
|
|
}
|
|
}
|