Skip to content

Instantly share code, notes, and snippets.

Avatar

Joldibaev Nurlan joldibaev

View GitHub Profile
@joldibaev
joldibaev / modal.service.ts
Created Nov 17, 2022
Angular create component and add to app-root
View modal.service.ts
import {ApplicationRef, createComponent, Injectable} from '@angular/core';
import {ModalComponent} from '../components/modal/modal.component';
@Injectable()
export class ModalService {
constructor(private applicationRef: ApplicationRef) {}
createModal() {
// Get an `EnvironmentInjector` instance from the `ApplicationRef`.
const environmentInjector = this.applicationRef.injector;
View build-prerender.sh
#!/bin/sh
echo "Build project"
npm run prerender
echo "Copy proxy-server to build"
cp scripts/proxy-server.js dist/prod
echo "move prerender pages to locales folder"
node scripts/move-prerender.js
View build-ssr.sh
#!/bin/sh
echo "Build project"
npm run build:ssr
echo "Copy proxy-server to build"
cp scripts/proxy-server.js dist/prod
View server.ts
/***************************************************************************************************
* Load `$localize` onto the global scope - used if i18n tags appear in Angular templates.
*/
import '@angular/localize/init';
import 'zone.js/node';
import {APP_BASE_HREF} from '@angular/common';
import {ngExpressEngine} from '@nguniversal/express-engine';
import * as express from 'express';
import {existsSync} from 'fs';
View move-prerender.js
const fs = require("fs");
const fse = require("fs-extra");
const PROD_PATH = "./dist/prod/browser/";
function moveFolder(folderPath, locale) {
let allFiles = fs.readdirSync(folderPath);
allFiles.forEach((fileName) => {
const path = folderPath + fileName;
const splitPath = path.split("/");
View proxy-server.js
const express = require("express");
const path = require("path");
const app = (language) => {
const distFolder = path.join(process.cwd(), "dist/prod/server", language);
const server = require(`${distFolder}/main.js`);
return server.app(language);
};
function run() {
View messages.ru.xlf
<xliff version="2.0" xmlns="urn:oasis:names:tc:xliff:document:2.0" srcLang="en" trgLang="ru">
<file original="ng.template" id="ngi18n">
<unit id="4584092443788135411">
<notes>
<note category="location">src/app/app.component.html:1</note>
</notes>
<segment state="initial">
<source>Hello World</source>
<target>Привет Мир!</target>
</segment>
View app.component.html
<h1 i18n>Hello World</h1>
<p i18n>Lorem ipsum dolor sit amet.</p>
View server-state.interceptor.ts
import {Inject, Injectable, Optional} from '@angular/core';
import {HttpHandler, HttpInterceptor, HttpRequest, HttpResponse} from '@angular/common/http';
import {tap} from 'rxjs/operators';
import {makeStateKey, TransferState} from '@angular/platform-browser';
import {REQUEST} from '@nguniversal/express-engine/tokens';
import {Request} from 'express';
@Injectable()
export class ServerStateInterceptor implements HttpInterceptor {
constructor(@Optional() @Inject(REQUEST) private request: Request, private transferState: TransferState) {}
View browser-state.interceptor.ts
import {Injectable} from '@angular/core';
import {HttpHandler, HttpInterceptor, HttpRequest, HttpResponse} from '@angular/common/http';
import {of} from 'rxjs';
import {makeStateKey, TransferState} from '@angular/platform-browser';
@Injectable()
export class BrowserStateInterceptor implements HttpInterceptor {
constructor(private transferState: TransferState) {}
intercept(request: HttpRequest<unknown>, next: HttpHandler) {