renderng page by block
npm install angular-lazy-render --saveOnce you have installed, you can import in your Angular AppModule:
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { LazyRenderModule } from 'angular-lazy-render';
import { AppComponent } from './app.component';
@NgModule({
declarations: [
AppComponent
],
imports: [
BrowserModule,
LazyRenderModule
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }wrap your page with <lazy-page>, and then block your page, wrap each page block with <lazy-block>
<lazy-page index="1">
<lazy-block>
section-0<h1>{{title}}</h1>
</lazy-block>
<section>
<lazy-block>
section-1 first render
</lazy-block>
<lazy-block>
section-2
</lazy-block>
</section>
<lazy-block>
<footer>section-3</footer>
</lazy-block>
</lazy-page>index: mark the first rendering block, default 0
npm startTo generate all *.js, *.d.ts and *.metadata.json files:
npm run build:libTo lint all *.ts files:
$ npm run lintMIT © angular-lazy-render