Set the direction (LTR / RTL).

Set the default direction#

Set the dir attribute on the document body or html tag.

<html dir="rtl"></html>

Set in the template#

Import the Angular CDK bidi module.

import {BidiModule} from '@angular/cdk/bidi';

Set the direction for the application or its descendants in the template.

<div dir="rtl"></div>

Set in the service#

For example, the modal service.

class MyComponent {
  constructor(private modalService: NzModalService, private configService: NzConfigService) { }

  openModal(): void {
      nzDirection: 'rtl'

  setDirWithConfig(): void {
    this.nzConfigService.set('modal', { nzDirection: 'rtl' });