0

I found the following code on angular docs. just want to understand the use of ! in the property declaration.

 @ViewChildren(Pane) panes !: QueryList<Pane>;`

this statement is used as follows 

export class ViewChildrenComp implements AfterViewInit {
  @ViewChildren(Pane) panes !: QueryList<Pane>;

  }
robsiemb
  • 6,157
  • 7
  • 32
  • 46
sanjay rathore
  • 11
  • 2

2 Answers2

2

@ViewChildren(Pane) panes !: QueryList<Pane>

About ! this is an operator in typescript called Non-Null Assertion Operator this operator takes a typed variable and removes the undefined and null types from it. In other words, it doesn't let your variable get null or undefined type. if you don't use it, you will get a compile error when strictNullChecks flag is on. it means when the flag is off the compiler does not check for undefined and null types assignments. in order to enable this flag, you must set it true in tsconfig.json

  {
    "compilerOptions": {
      ...
      "strictNullChecks": true,
      ...
     }
  }

In this case After Enable the flag if you don't use '!' when there is no pane directive in the component, you will get an error.

In order to make it more clear I have already prepared an example here

And if you need more information check this link

Alireza Varmaghani
  • 376
  • 3
  • 13
0

It's an assertion that this field is not null even it's not explicity initialized.

Check this out: https://www.typescriptlang.org/docs/handbook/release-notes/typescript-2-0.html#non-null-assertion-operator

mgierw
  • 73
  • 2
  • 8