angulardart library
The primary library for the AngularDart web framework.
Import this library as follows:
import 'package:angulardart/angulardart.dart';
Getting Started
The fastest way to get started is with the AngularDart CLI:
dart pub global activate angulardart_cli
ngdart new my_app
cd my_app
dart pub get
dart run build_runner serve
Minimal Example
import 'package:angulardart/angulardart.dart';
@Component(
selector: 'my-app',
template: '<h1>Hello {{name}}!</h1>',
)
class AppComponent {
String name = 'World';
}
void main() => runApp(AppComponent, 'my-app');
What's Included
This library exports the core AngularDart APIs:
- Bootstrapping: runApp, runAppAsync for starting applications.
- Components & Directives: Component, Directive, Pipe annotations.
- Dependency Injection: Injector, Provider, Module, and related annotations (Inject, Optional, Self, Host, SkipSelf).
- Lifecycle Hooks: OnInit, OnDestroy, OnChanges, AfterChanges, AfterContentInit, AfterContentChecked, AfterViewInit, AfterViewChecked, DoCheck.
- Change Detection: ChangeDetectionStrategy, ChangeDetectorRef.
- Common Directives: NgIf, NgFor, NgSwitch, NgClass, NgStyle.
- Common Pipes: DatePipe, UpperCasePipe, LowerCasePipe, SlicePipe, AsyncPipe, and more.
- Security: SafeHtml, SafeUrl, SafeStyle, SafeResourceUrl.
- DevTools: enableDevTools for debugging support.
Documentation
- AngularDart Guide - Comprehensive documentation.
- AngularDart Cheat Sheet - Quick reference.
- API Reference - This page.
Classes
- AfterChanges
- Implement this interface to get notified when any data-bound property of your directive is changed by the Angular framework.
- AfterContentChecked
- Implement this interface to get notified after every check of your directive's content.
- AfterContentInit
- Implement this interface to get notified when your directive's content has been fully initialized.
- AfterViewChecked
- Implement this interface to get notified after every check of your component's view.
- AfterViewInit
- Implement this interface to get notified when your component's view has been fully initialized.
- ApplicationRef Core
- A reference to an Angular application running on a page.
- AsyncPipe Pipes
-
An
asyncpipe awaits for a value from a Future or Stream. When a value is received, theasyncpipe marks the component to be checked for changes. - Attribute
- An annotation specifying that a constant attribute value should be injected.
- ChangeDetectionStrategy Change Detection
- Describes within the change detector which strategy will be used the next time change detection is triggered.
- ChangeDetectorRef Change Detection
- Provides influence over how change detection should execute for a component.
- ChangeDetectorState
- Describes the current state of the change detector.
-
ClassProvider<
T extends Object> -
Describes at compile-time configuring to return an instance of a
class. - Component Templates & Directives
- Declare reusable UI building blocks for an application.
-
ComponentFactory<
T extends Object> -
Backing implementation behind a
classTannotated with@Component. - ComponentLoader
- Supports imperatively loading and binding new components at runtime.
-
ComponentRef<
C> - Represents an instance of a Component created via a ComponentFactory.
- ContentChild
-
Declares a reference to a single child node projected into
<ng-content>. - ContentChildren
-
Declares a reference to multiple child nodes projected into
<ng-content>. - CurrencyPipe Pipes
- WARNING: this pipe uses the Internationalization API. Therefore it is only reliable in Chrome and Opera browsers.
- DatePipe Pipes
- Formats a date value to a string based on the requested format.
- DecimalPipe Pipes
- WARNING: this pipe uses the Internationalization API. Therefore it is only reliable in Chrome and Opera browsers.
- Directive Templates & Directives
- An annotation that marks a class as an Angular directive, allowing you to attach behavior to elements in the DOM.
- DoCheck
- Implement to execute ngDoCheck and implement your own change detection.
- ElementRef
- A wrapper around a native element inside of a View.
- EmbeddedViewRef
- An embedded Angular view that can be created and destroyed dynamically.
- ExceptionHandler
- Provides a hook for receiving unhandled errors/exceptions.
-
ExistingProvider<
T extends Object> - Describes at compile-time configuring to redirect to another token.
-
FactoryProvider<
T extends Object> - Describes at compile-time configuring to invoke a factory function.
- GenerateInjector
- Annotates a method to generate an Injector factory at compile-time.
- Host Dependency Injection
- Specifies that an injector should retrieve a dependency from any injector until reaching the closest host.
- HostBinding
- Declares a host property on the host component or element.
- HostListener
- Declares listening to eventName on the host element of the directive.
- Inject Dependency Injection
- A parameter metadata that specifies a dependency.
- Injectable Dependency Injection
- Compile-time metadata that marks a class Type or Function for injection.
- Injector Dependency Injection
- Support for imperatively loading dependency injected services at runtime.
- Input
- Declares a data-bound input property.
- LowerCasePipe Pipes
- Transforms text to lowercase.
- Module Dependency Injection
- Encapsulates a reusable set of dependency injection configurations.
-
MultiToken<
T extends Object> Dependency Injection -
A token representing multiple values of
Tfor dependency injection. - NgClass Templates & Directives
- The NgClass directive conditionally adds and removes CSS classes on an HTML element based on an expression's evaluation result.
- NgContentRef
-
Represents a reference to an
<ng-content>element. - NgFor Templates & Directives
-
The
NgFordirective instantiates a template once per item from an iterable. The context for each instantiated template inherits from the outer context with the given loop variable set to the current item from the iterable. - NgIf Templates & Directives
- Causes an element and its contents to be conditionally added/removed from the DOM based on the value of the given boolean template expression.
- NgStyle Templates & Directives
-
The
NgStyledirective changes an element's style based on the bound style expression: - NgSwitch Templates & Directives
- Adds or removes DOM sub-trees when their match expressions match the switch expression.
- NgSwitchDefault
- Default case statements are displayed when no match expression matches the switch expression value.
- NgSwitchWhen
-
Insert the sub-tree when the
ngSwitchWhenexpression evaluates to the same value as the enclosing switch expression. - NgTemplateOutlet
- Inserts an embedded view, created from a TemplateRef.
- NgZone
- Handles and observes the side-effects of executing callbacks in AngularDart.
- OnChanges
- Implement this interface to get notified when any data-bound property of your directive changes.
- OnDestroy
- Implement to execute ngOnDestroy before your component is destroyed.
- OnInit
- Implement to execute ngOnInit after the first change-detection completed.
-
OpaqueToken<
T extends Object> Dependency Injection - A token to be used instead of Type when configuring dependency injection.
- Optional Dependency Injection
- A parameter metadata that marks a dependency as optional.
- Output
- Declares an event-bound output property.
- PercentPipe Pipes
- WARNING: this pipe uses the Internationalization API. Therefore it is only reliable in Chrome and Opera browsers.
- Pipe Pipes
- Declare reusable pipe function.
-
Provider<
T extends Object> Dependency Injection -
Describes at compile-time how an
Injectorshould be configured. - ReflectiveInjector
- An injector that resolves Provider instances with runtime information.
- ReplacePipe Pipes
- Creates a new String with some or all of the matches of a pattern replaced by a replacement.
- SafeHtml Security
-
Represents HTML content that has been marked as trusted and should bypass
sanitization when used with
[innerHtml]bindings. - SafeHtmlDirective
- Directive that renders trusted HTML content without sanitization.
- SafeResourceUrl Security
-
Represents a resource URL that has been marked as trusted and should bypass
resource URL sanitization (e.g., for
<iframe src>). - SafeStyle Security
- Represents a style value that has been marked as trusted and should bypass style sanitization.
- SafeUrl Security
- Represents a URL that has been marked as trusted and should bypass URL sanitization.
- Self Dependency Injection
- Specifies that an Injector should retrieve a dependency only from itself.
- SkipSelf Dependency Injection
- Specifies that the dependency resolution should start from the parent injector.
- SlicePipe Pipes
- Creates a new List or String containing a subset (slice) of the elements.
- TemplateRef
- Represents an Embedded Template that can be used to instantiate Embedded Views.
- Testability Testing
- Provides testing hooks also accessible via JavaScript APIs in the browser.
- TestabilityRegistry
- A global registry of Testability instances given an app root element.
-
Typed<
T extends Object> -
Declares a typed directive or defines type argument of type
T. - UncaughtError
- An uncaught error and stackTrace emitted by NgZone.onUncaughtError.
- UpperCasePipe Pipes
- Implements uppercase transforms to text.
-
ValueProvider<
T extends Object> - Describes at compile-time using a constant value to represent a token.
- ViewChild
- Declares a reference to a single child node in a component's template.
- ViewChildren
- Declares a reference to multiple child nodes in a component's template.
- ViewContainerRef
- Represents a container where one or more views can be attached.
- ViewRef
- An Angular view that can be created and destroyed dynamically.
Enums
- ViewEncapsulation
-
Defines template and style encapsulation options available for Component's
View. - Visibility
- Options for configuring whether a directive class can be injected.
Extensions
Constants
-
APP_ID
→ const OpaqueToken<
String> - A dependency injection token representing a unique ID for the application.
-
commonPipes
→ const List<
Type> - A collection of built-in AngularDart core pipes.
-
coreDirectives
→ const List<
Type> - A collection of Angular core directives, such as NgFor and NgIf.
- noValueProvided → const Object
-
A marker that represents a lack-of-value for the
useValueparameter. - visibleForTemplate → const _VisibleForTemplate
- Used to annotate a class, field, or method that is public for template use.
Functions
-
bootstrapStatic<
T extends Object> (Type componentType, [List< Object> providers = const [], void initReflector()?]) → Future<ComponentRef< T> > -
Starts a new AngularDart application with
componentTypeas the root. -
debugCheckBindings(
[bool enabled = true]) → void - Opt-in/out to more precise and exhaustive checking of AngularDart bindings.
-
debugClearComponentStyles(
) → void - Clears all component styles from the DOM.
-
enableDevTools(
) → void DevTools - Enables developer tools if in development mode.
-
provide<
T extends Object> (Object token, {Type? useClass, Object useValue = noValueProvided, Object? useExisting, Function? useFactory, List< Object> ? deps}) → Provider<T> -
Short-hand for
Provider(...). -
registerContentRoot(
Element element) → void -
Registers
elementas an additional location to search for components. -
runApp<
T extends Object> (ComponentFactory< CoreT> componentFactory, {InjectorFactory createInjector = _identityInjector}) → ComponentRef<T> -
Starts a new AngularDart application with
componentFactoryas the root. -
runAppAsync<
T extends Object> (ComponentFactory< CoreT> componentFactory, {required Future<void> beforeComponentCreated(Injector), InjectorFactory createInjector = _identityInjector}) → Future<ComponentRef< T> > -
Asynchronous alternative to runApp, supporting
beforeComponentCreated. -
runAppLegacy<
T extends Object> (Type componentType, {List< Object> createInjectorFromProviders = const [], void initReflector()?}) → ComponentRef<T> -
Starts a new AngularDart application with
componentTypeas the root. -
runAppLegacyAsync<
T extends Object> (Type componentType, {required Future< void> beforeComponentCreated(Injector), List<Object> createInjectorFromProviders = const [], void initReflector()?}) → Future<ComponentRef< T> > -
Starts a new AngularDart application with
componentTypeas the root.
Typedefs
Exceptions / Errors
- InjectionError
- A class of error that is thrown related to dependency injection.
- NoProviderError
- Thrown when there is no dependency injection provider found for a token.