programing

각도 이유 별표(*)

padding 2023. 8. 31. 23:41
반응형

각도 이유 별표(*)

Angular document, * template에서 *ngIf, *ngSwitch, *ngFor는 ng-template 태그로 확장할 수 있습니다.제 질문은:

제 생각엔ngIf또는ngFor없이.*Angular 엔진을 통해 템플릿 태그로 변환 및 확장할 수도 있습니다.

다음 코드

<hero-detail *ngIf="currentHero" [hero]="currentHero"></hero-detail>

과 같을 것입니다.

<ng-template [ngIf]="currentHero">
  <hero-detail [hero]="currentHero"></hero-detail>
</ng-template>

그래서 왜 이상한 기호 별표를 디자인해야 합니까?*) Angular에서?

별표 구문은 명령어가 후드 아래로 확장되는 더 많은 단어 템플릿 구문을 위한 구문 설탕입니다. 이러한 옵션 중 하나를 자유롭게 사용할 수 있습니다.

문서에서 인용한 내용:

별표는 "통사 설탕"입니다.작성자와 판독기 모두에 대해 ngIf와 ngF를 단순화합니다.후드 아래에서 Angular는 별표 버전을 더 자세한 형식으로 바꿉니다.

다음 두 ngIf 예제가 사실상 동일하고 두 가지 유형 중 하나로 작성할 수 있으면 다음과 같습니다.

<!-- Examples (A) and (B) are the same -->

<!-- (A) *ngIf paragraph -->
<p *ngIf="condition">
  Our heroes are true!
</p>

<!-- (B) [ngIf] with template -->
<template [ngIf]="condition">
  <p>
    Our heroes are true!
  </p>
</template>

Angular2는 특수한 종류의 지침을 제공합니다 - 구조 지침

구조 지침은 다음을 기반으로 합니다.<template>꼬리표를 달다

*속성 선택기가 일반 속성 지시 또는 속성 바인딩 대신 구조 지시가 적용되어야 함을 나타내기 전에.Angular2는 내부적으로 구문을 명시적으로 확장합니다.<template>꼬리표를 달다

결승전 이후로 또한 있습니다.<ng-container>유사하게 사용할 수 있는 요소<template>태그를 지정하지만 일반적인 단문 구문을 지원합니다.이는 예를 들어 지원되지 않는 단일 요소에 두 개의 구조적 지시를 적용해야 하는 경우에 필요합니다.

<ng-container *ngIf="boolValue">
  <div *ngFor="let x of y"></div>
</ng-container>

Angular는 템플릿 요소를 특별한 방법으로 처리합니다.*구문은 전체를 쓰는 것을 피할 수 있는 지름길입니다.<template>원소의어떻게 작동하는지 보여드리겠습니다.

이것을 이용하여

*ngFor="let t of todos; let i=index"

로 번역합니다.

template="ngFor: let t of todos; let i=index" 

그런 다음 로 변환됩니다.

<template ngFor [ngForOf]="todos" .... ></template>

또한 아굴라의 구조 지침은 다음과 같습니다.ngFor,ngIf기타 접두어:*다른 사용자 지정 지침 및 구성 요소와 차별화하기 위해 사용할 수 있습니다.

여기서 더 보기

Angular 문서에서:

구조 지시문은 HTML 레이아웃을 담당합니다.일반적으로 요소를 추가, 제거 또는 조작하여 DOM의 구조를 형성하거나 재구성합니다.

다른 지시어와 마찬가지로 구조 지시어를 호스트 요소에 적용합니다.그런 다음 명령은 호스트 요소와 그 하위 요소와 관련된 모든 작업을 수행합니다.

구조 지침은 알아보기 쉽습니다.이 예와 같이 지시 속성 이름 앞에는 별표(*)가 붙습니다.

<p *ngIf="userInput">{{username}}</p>

때때로 당신은 필요할지도 모릅니다.<a *ngIf="cond">를 들어, 태그가 . 를 여러 하여 예를들어, 그하태때일그의실제가를때태때. 로당은신래않여고지지러태를그퍼그배로다있니수주습싶서위을에치고하나것이if를▁for▁tags▁the▁want▁put▁you▁withoutif▁to▁multiple▁sometimes▁it▁you▁ng▁tag▁when▁may다니예습있수▁to를▁having▁as▁one▁leads▁example,싶▁which's▁only을,▁tag배때태▁wrapper▁around▁a▁real그않때때들어▁a러고고주<template [ngIf]="cond">태그. 각도가 최종 결과 html에서 ngIf 지시 소유자를 렌더링해야 하는지 여부를 어떻게 알 수 있습니까? 따라서 코드를 더 명확하게 만드는 것 이상의 것입니다.그것은 필요한 차이입니다.

언급URL : https://stackoverflow.com/questions/40078189/angular-why-asterisk

반응형