*ngIf is replaced by new @if syntax

npm/ng-packs/packages/feature-management/src/lib/components/feature-management-tab/feature-management-tab.component.html

@@ -4,7 +4,7 @@
   <i class="me-1 fa fa-cog" aria-hidden="true"></i>
   {{ 'AbpFeatureManagement::ManageHostFeatures' | abpLocalization }}
 </button>
-<ng-container *ngIf="visibleFeatures">
+@if (visibleFeatures) {
   <abp-feature-management
     *abpReplaceableTemplate="{
       inputs: {
@@ -20,4 +20,4 @@
     [providerKey]="providerKey"
   >
   </abp-feature-management>
-</ng-container>
+}

npm/ng-packs/packages/setting-management/config/src/lib/components/email-setting-group/email-setting-group.component.html

@@ -1,95 +1,95 @@
-<form
+@if (form) {
-  *ngIf="form"
+  <form [formGroup]="form" class="py-2 abp-md-form" (ngSubmit)="submit()" [validateOnSubmit]="true">
-  [formGroup]="form"
-  class="py-2 abp-md-form"
-  (ngSubmit)="submit()"
-  [validateOnSubmit]="true"
->
-  <div class="mb-3 form-group">
-    <label class="form-label"
-      >{{ 'AbpSettingManagement::DefaultFromDisplayName' | abpLocalization
-      }}<span class="ms-1">*</span></label
-    >
-    <input type="text" class="form-control" formControlName="defaultFromDisplayName" />
-  </div>
-  <div class="mb-3 form-group">
-    <label class="form-label"
-      >{{ 'AbpSettingManagement::DefaultFromAddress' | abpLocalization
-      }}<span class="ms-1">*</span></label
-    >
-    <input type="text" class="form-control" formControlName="defaultFromAddress" />
-  </div>
-  <div class="mb-3 form-group">
-    <label class="form-label">{{ 'AbpSettingManagement::SmtpHost' | abpLocalization }}</label>
-    <input type="text" class="form-control" formControlName="smtpHost" />
-  </div>
-  <div class="mb-3 form-group">
-    <label class="form-label"
-      >{{ 'AbpSettingManagement::SmtpPort' | abpLocalization }}<span class="ms-1">*</span></label
-    >
-    <input type="number" class="form-control" formControlName="smtpPort" />
-  </div>
-
-  <div class="form-check mb-2">
-    <input
-      type="checkbox"
-      id="smtp-enable-ssl"
-      class="form-check-input"
-      formControlName="smtpEnableSsl"
-    />
-    <label class="form-check-label" for="smtp-enable-ssl">{{
-      'AbpSettingManagement::SmtpEnableSsl' | abpLocalization
-    }}</label>
-  </div>
-  <div class="form-check mb-2">
-    <input
-      type="checkbox"
-      id="smtp-use-default-credentials"
-      class="form-check-input"
-      formControlName="smtpUseDefaultCredentials"
-    />
-    <label class="form-check-label" for="smtp-use-default-credentials">{{
-      'AbpSettingManagement::SmtpUseDefaultCredentials' | abpLocalization
-    }}</label>
-  </div>
-
-  <div
-    [@collapse]="{
-      value: form.get('smtpUseDefaultCredentials')?.value ? 'collapsed' : 'expanded',
-      params: { time: '200ms', easing: 'linear' }
-    }"
-  >
     <div class="mb-3 form-group">
-      <label class="form-label">{{ 'AbpSettingManagement::SmtpDomain' | abpLocalization }}</label>
+      <label class="form-label"
-      <input type="text" class="form-control" formControlName="smtpDomain" />
+        >{{ 'AbpSettingManagement::DefaultFromDisplayName' | abpLocalization
+        }}<span class="ms-1">*</span></label
+      >
+      <input type="text" class="form-control" formControlName="defaultFromDisplayName" />
+    </div>
+    <div class="mb-3 form-group">
+      <label class="form-label"
+        >{{ 'AbpSettingManagement::DefaultFromAddress' | abpLocalization
+        }}<span class="ms-1">*</span></label
+      >
+      <input type="text" class="form-control" formControlName="defaultFromAddress" />
+    </div>
+    <div class="mb-3 form-group">
+      <label class="form-label">{{ 'AbpSettingManagement::SmtpHost' | abpLocalization }}</label>
+      <input type="text" class="form-control" formControlName="smtpHost" />
     </div>
-
     <div class="mb-3 form-group">
-      <label class="form-label">{{ 'AbpSettingManagement::SmtpUserName' | abpLocalization }}</label>
+      <label class="form-label"
-      <input type="text" class="form-control" formControlName="smtpUserName" />
+        >{{ 'AbpSettingManagement::SmtpPort' | abpLocalization }}<span class="ms-1">*</span></label
+      >
+      <input type="number" class="form-control" formControlName="smtpPort" />
     </div>
 
-    <div class="form-group">
+    <div class="form-check mb-2">
-      <label class="form-label">{{ 'AbpSettingManagement::SmtpPassword' | abpLocalization }}</label>
+      <input
-      <input type="password" class="form-control" formControlName="smtpPassword" />
+        type="checkbox"
+        id="smtp-enable-ssl"
+        class="form-check-input"
+        formControlName="smtpEnableSsl"
+      />
+      <label class="form-check-label" for="smtp-enable-ssl">{{
+        'AbpSettingManagement::SmtpEnableSsl' | abpLocalization
+      }}</label>
+    </div>
+    <div class="form-check mb-2">
+      <input
+        type="checkbox"
+        id="smtp-use-default-credentials"
+        class="form-check-input"
+        formControlName="smtpUseDefaultCredentials"
+      />
+      <label class="form-check-label" for="smtp-use-default-credentials">{{
+        'AbpSettingManagement::SmtpUseDefaultCredentials' | abpLocalization
+      }}</label>
     </div>
-  </div>
 
-  <hr />
+    <div
+      [@collapse]="{
+        value: form.get('smtpUseDefaultCredentials')?.value ? 'collapsed' : 'expanded',
+        params: { time: '200ms', easing: 'linear' }
+      }"
+    >
+      <div class="mb-3 form-group">
+        <label class="form-label">{{ 'AbpSettingManagement::SmtpDomain' | abpLocalization }}</label>
+        <input type="text" class="form-control" formControlName="smtpDomain" />
+      </div>
 
-  <abp-button buttonType="submit" iconClass="fa fa-save">
+      <div class="mb-3 form-group">
-    {{ 'AbpSettingManagement::Save' | abpLocalization }}
+        <label class="form-label">{{
-  </abp-button>
+          'AbpSettingManagement::SmtpUserName' | abpLocalization
-  <button
+        }}</label>
-    *abpPermission="emailingPolicy"
+        <input type="text" class="form-control" formControlName="smtpUserName" />
-    type="button"
+      </div>
-    (click)="openSendEmailModal()"
+
-    class="btn btn-primary mx-2"
+      <div class="form-group">
-  >
+        <label class="form-label">{{
-    <i class="fa f-send" aria-hidden="true"></i>
+          'AbpSettingManagement::SmtpPassword' | abpLocalization
-    {{ 'AbpSettingManagement::SendTestEmail' | abpLocalization }}
+        }}</label>
-  </button>
+        <input type="password" class="form-control" formControlName="smtpPassword" />
-</form>
+      </div>
+    </div>
+
+    <hr />
+
+    <abp-button buttonType="submit" iconClass="fa fa-save">
+      {{ 'AbpSettingManagement::Save' | abpLocalization }}
+    </abp-button>
+    <button
+      *abpPermission="emailingPolicy"
+      type="button"
+      (click)="openSendEmailModal()"
+      class="btn btn-primary mx-2"
+    >
+      <i class="fa f-send" aria-hidden="true"></i>
+      {{ 'AbpSettingManagement::SendTestEmail' | abpLocalization }}
+    </button>
+  </form>
+}
 
 <abp-modal [(visible)]="isEmailTestModalOpen" [options]="modalSize">
   <ng-template #abpHeader>