arturovt

@Injectable({ providedIn: 'root' })
export class UserService {
  private id = this.store.selectSnapshot<UserStateModel>(UserState).id;

  constructor(private http: HttpClient, private store: Store) {}

  public getUser() {
    return this.http.get(`${environment.apiUrl}/users/${this.id}`);
  }

arturovt

@Injectable({ providedIn: 'root' })
export class UserService {
  constructor(private http: HttpClient, private store: Store) {}

  public getUser() {
    const { id } = this.store.selectSnapshot<UserStateModel>(UserState);
    return this.http.get(`${environment.apiUrl}/users/${id}`);
  }

  public getLoginHistory() {

arturovt

import { SelectSnapshot } from '@ngxs-labs/select-snapshot';

@Injectable({ providedIn: 'root' })
export class AuthGuard implements CanActivate {
  @SelectSnapshot(AuthState)
  public auth: AuthStateModel;

  public canActivate(): boolean {
    return this.auth.isAuthenticated;
  }

arturovt

@Injectable({ providedIn: 'root' })
export class AuthGuard implements CanActivate {
  constructor(private store: Store) {}

  public canActivate(): boolean {
    const { isAuthenticated } = this.store.selectSnapshot<AuthStateModel>(AuthState);
    return isAuthenticated;
  }
}

arturovt

<ng-container *ngComponentOutlet="ButtonComponent"></ng-container>

<!-- Compiled template -->
<ng-template [ngComponentOutlet]="ButtonComponent">
  <!-- Unused `ng-container` -->
  <ng-container></ng-container>
</ng-template>

<!-- Much better, no unused `ng-container` -->
<ng-template [ngComponentOutlet]="ButtonComponent"></ng-template>

arturovt

{
  renderElement: p, // reference to the instance of HTMLParagraphElement
  componentView: undefined,
  viewContainer: null,
  template: undefined
}

arturovt

@Component({
  selector: 'app-some-component',
  template: `
    <ng-tempate>
      <p>Hello world!</p>
    </ng-tempate>
  `
})
export class SomeComponent {}

arturovt

@Component({
  selector: 'app-some-component',
  template: `
    <ng-template>
      <p>Hello world!</p>
    </ng-template>
  `
})
export class SomeComponent {}

arturovt

<ng-container *ngComponentOutlet="ButtonComponent"></ng-container>

<!-- Скомпилированный шаблон -->
<ng-template [ngComponentOutlet]="ButtonComponent">
  <!-- Неиспользуемый `ng-container` -->
  <ng-container></ng-container>
</ng-template>

<!-- Гораздо лучше, нет неиспользуемого контейнера -->
<ng-template [ngComponentOutlet]="ButtonComponent"></ng-template>

arturovt

<ng-template [ngIf]="authorized">
  <button>Profile</button>
  <button>Logout</button>
</ng-template>