1、Angular2RenderDirectivesSTATUS: DRAFTyjbanov@google.comA render directive is a new kind of directive introduced in Angular 2. It addresses the need to implement platformspecific features that Angular core does not provide outofthebox. Render directives provide API to the developer to inter
2、act directly with the Render API and platform APIs, such as browser HTML DOM API.This document describes the design for render directives for the browser. It is likely that we will need a similar concept for nonbrowser environments, but that is out of scope for this document. Code samples
3、in this document are written in Dart but apply to TypeScript as well.BackgroundDesignSelecting NodesRenderDirective annotationDefining render directivesContext objectsValue bindingAutopipesLifecycleEventsBackgroundAngular’s application layer is designed to be platformagnostic. This include
4、s DI, directives, change detection and the template language. It does not mean that you write an application once and run it on all platforms. It means you learn the core Angular concepts and APIs once, and reuse that knowledge on many platforms. However, a given Angular application target
5、s a specific platform, and therefore needs access to that platform’s features. Usecases include:Binding to native properties, such as “classList” (DOMTokenList), “style” (CSSStyleDeclaration) and “attributes” (NamedNodeMap).Animations, overlays and other styling and theming aspectsCustom d
6、ata modelstoDOM syncing, for example:Game scene graph synced to canvasVirtualDOM synced to real HTML DOMChart data synced to SVGDesignDefinition: Render directives is a developerfacing API for implementing browserspecific features in Angular.Render directives live in the render layer and o
7、perate on native HTML DOM nodes and View objects as defined in Angular’s Render API. They do not directly participate it change detection and dependency injection. The application is connected to render directives through the Renderer, and can pass data throug