ngView (directive in module ng )

Improve this doc

Description

Overview

ngView is a directive that complements the $route service by including the rendered template of the current route into the main layout (index.html) file. Every time the current route changes, the included view changes with it according to the configuration of the $route service.

Additionally, you can also provide animations via the ngAnimate attribute to animate the enter and leave effects.

Usage

This directive can be used as custom element, but we aware of IE restrictions.

as element:
<ng-view>
</ng-view>
as attribute
<ANY ng-view>
   ...
</ANY>
as class
<ANY class="ng-view">
   ...
</ANY>
with animations
//The enter and leave animations are supported
<ANY ng-view ng-animate="{enter: 'enter-animation', leave: 'leave-animation'}">
   ...
</ANY>
Click here to learn more about the steps involved in the animation.

Directive info

  • This directive creates new scope.

Animations

  • enter - happens just after the ngView contents are changed (when the new view DOM element is inserted into the DOM)
  • leave - happens just after the current ngView contents change and just before the former contents are removed from the DOM

Events

Example

Source













Demo