Dart Documentationangular.coreNgAnnotation

NgAnnotation class

class NgAnnotation {
 /**
  * CSS selector which will trigger this component/directive.
  * CSS Selectors are limited to a single element and can contain:
  *
  * * `element-name` limit to a given element name.
  * * `.class` limit to an element with a given class.
  * * `[attribute]` limit to an element with a given attribute name.
  * * `[attribute=value]` limit to an element with a given attribute and value.
  *
  *
  * Example: `input[type=checkbox][ng-model]`
  */
 final String selector;

 /**
  * Specifies the compiler action to be taken on the child nodes of the
  * element which this currently being compiled.  The values are:
  *
  * * [COMPILE_CHILDREN] (*default*)
  * * [TRANSCLUDE_CHILDREN]
  * * [IGNORE_CHILDREN]
  */
 final String children;

 /**
  * Compile the child nodes of the element.  This is the default.
  */
 static const String COMPILE_CHILDREN = 'compile';
 /**
  * Compile the child nodes for transclusion and makes available
  * [BoundBlockFactory], [BlockFactory] and [BlockHole] for injection.
  */
 static const String TRANSCLUDE_CHILDREN = 'transclude';
 /**
  * Do not compile/visit the child nodes.  Angular markup on descendant nodes
  * will not be processed.
  */
 static const String IGNORE_CHILDREN = 'ignore';

 /**
  * A directive/component controller class can be injected into other
  * directives/components. This attribute controls whether the
  * controller is available to others.
  *
  * * `local` [NgDirective.LOCAL_VISIBILITY] - the controller can be injected
  *   into other directives / components on the same DOM element.
  * * `children` [NgDirective.CHILDREN_VISIBILITY] - the controller can be
  *   injected into other directives / components on the same or child DOM
  *   elements.
  * * `direct_children` [NgDirective.DIRECT_CHILDREN_VISIBILITY] - the
  *   controller can be injected into other directives / components on the
  *   direct children of the current DOM element.
  */
 final String visibility;
 final List<Type> publishTypes;

 /**
  * Use map to define the mapping of  DOM attributes to fields.
  * The map's key is the DOM attribute name (DOM attribute is in dash-case).
  * The Map's value consists of a mode prefix followed by an expression.
  * The destination expression will be evaluated against the instance of the
  * directive / component class.
  *
  * * `@` - Map the DOM attribute string. The attribute string will be taken
  *   literally or interpolated if it contains binding {{}} systax and assigned
  *   to the expression. (cost: 0 watches)
  *
  * * `=>` - Treat the DOM attribute value as an expression. Set up a watch,
  *   which will read the expression in the attribute and assign the value
  *   to destination expression. (cost: 1 watch)
  *
  * * `<=>` - Treat the DOM attribute value as an expression. Set up a watch
  *   on both outside as well as component scope to keep the src and
  *   destination in sync. (cost: 2 watches)
  *
  * * `=>!` - Treat the DOM attribute value as an expression. Set up a one time
  *   watch on expression. Once the expression turns truthy it will no longer
  *   update. (cost: 1 watches until not null, then 0 watches)
  *
  * * `&` - Treat the DOM attribute value as an expression. Assign a closure
  *   function into the field. This allows the component to control
  *   the invocation of the closure. This is useful for passing
  *   expressions into controllers which act like callbacks. (cost: 0 watches)
  *
  * Example:
  *
  *     <my-component title="Hello {{username}}"
  *                   selection="selectedItem"
  *                   on-selection-change="doSomething()">
  *
  *     @NgComponent(
  *       selector: 'my-component'
  *       map: const {
  *         'title': '@title',
  *         'selection': '<=>currentItem',
  *         'on-selection-change': '&onChange'
  *       }
  *     )
  *     class MyComponent {
  *       String title;
  *       var currentItem;
  *       ParsedFn onChange;
  *     }
  *
  *  The above example shows how all three mapping modes are used.
  *
  *  * `@title` maps the title DOM attribute to the controller `title`
  *    field. Notice that this maps the content of the attribute, which
  *    means that it can be used with `{{}}` interpolation.
  *
  *  * `<=>currentItem` maps the expression (in this case the `selectedItem`
  *    in the current scope into the `currentItem` in the controller. Notice
  *    that mapping is bi-directional. A change either in field or on
  *    parent scope will result in change to the other.
  *
  *  * `&onChange` maps the expression into tho controllers `onChange`
  *    field. The result of mapping is a callable function which can be
  *    invoked at any time by the controller. The invocation of the
  *    callable function will result in the expression `doSomething()` to
  *    be executed in the parent context.
  */
 final Map<String, String> map;

 /**
  * Use the list to specify expression containing attributes which are not
  * included under [map] with '=' or '@' specification.
  */
 final List<String> exportExpressionAttrs;

 /**
  * Use the list to specify a expressions which are evaluated dynamically
  * (ex. via [Scope.$eval]) and are otherwise not statically discoverable.
  */
 final List<String> exportExpressions;

 /**
  * An expression under which the controller instance will be published into.
  * This allows the expressions in the template to be referring to controller
  * instance and its properties.
  */
 final String publishAs;

 const NgAnnotation({
   this.selector,
   this.children: NgAnnotation.COMPILE_CHILDREN,
   this.visibility: NgDirective.LOCAL_VISIBILITY,
   this.publishAs,
   this.publishTypes: const [],
   this.map: const {},
   this.exportExpressions: const [],
   this.exportExpressionAttrs: const []
 });

 toString() => selector;
 get hashCode => selector.hashCode;
 operator==(other) =>
     other is NgAnnotation && this.selector == other.selector;

}

Subclasses

NgComponent, NgDirective

Static Properties

const String COMPILE_CHILDREN #

Compile the child nodes of the element. This is the default.

static const String COMPILE_CHILDREN = 'compile'

const String IGNORE_CHILDREN #

Do not compile/visit the child nodes. Angular markup on descendant nodes will not be processed.

static const String IGNORE_CHILDREN = 'ignore'

const String TRANSCLUDE_CHILDREN #

Compile the child nodes for transclusion and makes available BoundBlockFactory, BlockFactory and BlockHole for injection.

static const String TRANSCLUDE_CHILDREN = 'transclude'

Constructors

const NgAnnotation({String selector, String children: NgAnnotation.COMPILE_CHILDREN, String visibility: NgDirective.LOCAL_VISIBILITY, String publishAs, List<Type> publishTypes: const[] , Map<String, String> map: const{}, List<String> exportExpressions: const[] , List<String> exportExpressionAttrs: const[] }) #

Creates a new Object instance.

Object instances have no meaningful state, and are only useful through their identity. An Object instance is equal to itself only.

docs inherited from Object
const NgAnnotation({
 this.selector,
 this.children: NgAnnotation.COMPILE_CHILDREN,
 this.visibility: NgDirective.LOCAL_VISIBILITY,
 this.publishAs,
 this.publishTypes: const [],
 this.map: const {},
 this.exportExpressions: const [],
 this.exportExpressionAttrs: const []
});

Properties

final String children #

Specifies the compiler action to be taken on the child nodes of the element which this currently being compiled. The values are:

final String children

final List<String> exportExpressionAttrs #

Use the list to specify expression containing attributes which are not included under map with '=' or '@' specification.

final List<String> exportExpressionAttrs

final List<String> exportExpressions #

Use the list to specify a expressions which are evaluated dynamically (ex. via Scope.$eval) and are otherwise not statically discoverable.

final List<String> exportExpressions

final hashCode #

Get a hash code for this object.

All objects have hash codes. Hash codes are guaranteed to be the same for objects that are equal when compared using the equality operator ==. Other than that there are no guarantees about the hash codes. They will not be consistent between runs and there are no distribution guarantees.

If a subclass overrides hashCode it should override the equality operator as well to maintain consistency.

docs inherited from Object
get hashCode => selector.hashCode;

final Map<String, String> map #

Use map to define the mapping of DOM attributes to fields. The map's key is the DOM attribute name (DOM attribute is in dash-case). The Map's value consists of a mode prefix followed by an expression. The destination expression will be evaluated against the instance of the directive / component class.

  • @ - Map the DOM attribute string. The attribute string will be taken literally or interpolated if it contains binding {{}} systax and assigned to the expression. (cost: 0 watches)

  • => - Treat the DOM attribute value as an expression. Set up a watch, which will read the expression in the attribute and assign the value to destination expression. (cost: 1 watch)

  • <=> - Treat the DOM attribute value as an expression. Set up a watch on both outside as well as component scope to keep the src and destination in sync. (cost: 2 watches)

  • =>! - Treat the DOM attribute value as an expression. Set up a one time watch on expression. Once the expression turns truthy it will no longer update. (cost: 1 watches until not null, then 0 watches)

  • & - Treat the DOM attribute value as an expression. Assign a closure function into the field. This allows the component to control the invocation of the closure. This is useful for passing expressions into controllers which act like callbacks. (cost: 0 watches)

Example:

<my-component title="Hello {{username}}"
              selection="selectedItem"
              on-selection-change="doSomething()">

@NgComponent(
  selector: 'my-component'
  map: const {
    'title': '@title',
    'selection': '<=>currentItem',
    'on-selection-change': '&onChange'
  }
)
class MyComponent {
  String title;
  var currentItem;
  ParsedFn onChange;
}

The above example shows how all three mapping modes are used.

  • @title maps the title DOM attribute to the controller title field. Notice that this maps the content of the attribute, which means that it can be used with {{}} interpolation.

  • <=>currentItem maps the expression (in this case the selectedItem in the current scope into the currentItem in the controller. Notice that mapping is bi-directional. A change either in field or on parent scope will result in change to the other.

  • &onChange maps the expression into tho controllers onChange field. The result of mapping is a callable function which can be invoked at any time by the controller. The invocation of the callable function will result in the expression doSomething() to be executed in the parent context.

final Map<String, String> map

final String publishAs #

An expression under which the controller instance will be published into. This allows the expressions in the template to be referring to controller instance and its properties.

final String publishAs

final List<Type> publishTypes #

final List<Type> publishTypes

final String selector #

CSS selector which will trigger this component/directive. CSS Selectors are limited to a single element and can contain:

  • element-name limit to a given element name.
  • .class limit to an element with a given class.
  • [attribute] limit to an element with a given attribute name.
  • [attribute=value] limit to an element with a given attribute and value.

Example: input[type=checkbox][ng-model]

final String selector

final String visibility #

A directive/component controller class can be injected into other directives/components. This attribute controls whether the controller is available to others.

  • local NgDirective.LOCAL_VISIBILITY - the controller can be injected into other directives / components on the same DOM element.

  • children NgDirective.CHILDREN_VISIBILITY - the controller can be injected into other directives / components on the same or child DOM elements.

  • direct_children [NgDirective.DIRECT_CHILDREN_VISIBILITY] - the controller can be injected into other directives / components on the direct children of the current DOM element.

final String visibility

Operators

dynamic operator ==(other) #

The equality operator.

The default behavior for all Objects is to return true if and only if this and other are the same object.

Override this method to specify a different equality relation on a class. The overriding method must still be an equivalence relation. That is, it must be:

  • Total: It must return a boolean for all arguments. It should never throw or return null.

  • Reflexive: For all objects o, o == o must be true.

  • Symmetric: For all objects o1 and o2, o1 == o2 and o2 == o1 must either both be true, or both be false.

  • Transitive: For all objects o1, o2, and o3, if o1 == o2 and o2 == o3 are true, then o1 == o3 must be true.

The method should also be consistent over time, so equality of two objects should not change over time, or at least only change if one of the objects was modified.

If a subclass overrides the equality operator it should override the hashCode method as well to maintain consistency.

docs inherited from Object
operator==(other) =>
   other is NgAnnotation && this.selector == other.selector;

Methods

dynamic toString() #

Returns a string representation of this object.

docs inherited from Object
toString() => selector;