Implement attribute directives with @Directive
, @HostBinding
and @HostListener
.
Use Renderer2
, ElementRef
and NativeElement
to change the appearance and behavior of DOM elements.
Set data attributes (eg data-item
) on an HTML element and then read the values using the getAttribute
method or the dataset
property.
Iterate over a TypeScript enum and use the values to populate a dropdown list.
*ngFor
Directive to Repeat n Times in AngularA few examples of how to use *ngFor
to repeat an element a specified number of times.
Examples of how to use template reference variables to reference DOM elements, components and directives in a template.
An example of how child routes and nested directives allow navigation between multiple views when a user clicks a link in a sub-menu.
This tutorial builds on a simple router example and assumes that you have read this tutorial first.
Use the Angular router to navigate between components when the user clicks a link. We take a look at routerLink
, routerLinkActive
, <router-outlet>
and more.
See how event bindings listen for DOM events such as click
and keypress
on standard HTML elements such as button
and input
.
Bind to the following <input>
fields with Angular 2 and TypeScript: text
, textarea
, checkbox
, radio
and select
(drop-down list).
Interpolation uses template expressions in double curly braces to display data from the component class and template reference variables.
Use template expressions to bind to DOM properties such as hidden
and title
on standard HTML elements such as div
and span
.
Combine the square brackets of property binding and the parentheses of event binding to create two-way binding with ngModel
.
Angular's templates mix native HTML with custom elements. In this short tutorial we see how to use inline and external templates.
Use property binding and the @Input
decorator to pass data into a component, and @Output
and EventEmitter
to pass data out and bind to an event.
Learn Angular with TypeScript. This tutorial includes examples of components, template syntax, property binding, event binding, bootstrapping and more.
See how Angular uses the ngIf, ngSwitch, ngFor, ngClass and ngStyle directives to transform the DOM when a template is rendered.
The ngIf
directive adds and removes elements in the DOM based on the results of an expression.
The ngSwitch
directive displays one element (and its children) from a set of possible options, based on some condition.
ngFor
is a repeater directive which outputs a list of elements by iterating over an array.
ngClass
adds and removes CSS classes on an element. An [ngClass]
directive (in square brackets) uses the results of a template expression (in quotes) to set the names of the classes.
The ngStyle
directive allows you to set CSS styles on an HTML element conditionally.
Content projection is a way to import HTML content from outside the component and insert that content into the component's template in a designated spot.
A quick start example for beginners who are new to Angular and TypeScript. This tutorial shows how to implement a super-simple custom element using an Angular component.
Set up and configure an application with Angular 2 and TypeScript.
Map a one-to-many entity association in Hibernate using the @OneToMany annotation.
Map a many-to-one entity association in Hibernate using the @ManyToOne annotation
Discover the power of explicit inner, outer and theta-style joins in Hibernate Query Language.
Use functional interfaces, lambda expressions and streams to provide operations such as map and filter on a list of items.
Using JUnit and Spring's TestContext framework to create MongoDB repository integration tests.
Examples of how to set up the MongoRepository to read and update MongoDB. Shows the count, exists, find, save and delete methods, plus paging and sorting.
Integrate Spring Data provided functionality with manually implemented custom methods in a single JPA repository. Provide custom repository code and integrate it with generic CRUD abstraction and query method functionality.
Use Java configuration to set up Spring Data MongoDB.
Shows how to query documents using the MongoTemplate
find and findOne
methods. Includes between
, in-list
, regex
, logical and/or queries, and more.
Integrate Spring Data provided functionality with manually implemented methods in a single MongoDB repository.
How to use Java configuration to set up Spring Data JPA with Hibernate and Oracle.
Learn how to use MongoTemplate
to create, read, update and delete (CRUD) documents in MongoDB, using the insert
, find
, update
and remove
methods.
Use @Document
, @Field
, @Id
, @DBRef
, @PersistenceConstructor
, @TypeAlias
and @Indexed
to map Java objects to MongoDB documents.
Use JUnit and Spring's TestContext framework to run JPA repository integration tests.
Examples of MongoRepository
queries using custom query methods and @Query
annotations. Includes between, like, regex, logical and/or queries, and more.
Examples of JpaRepository
queries using custom query methods and @Query
annotations. Includes between, like, ignore case, logical and/or queries, and more.