我正在尝试编译这里基于示例项目创建的Angular 4 + ASP.NET Universal应用程序,使用此提示https://github.com/angular/universal#universal-gotchas 以及当我使用webpack构建项目时,然后运行它如果检查了块,则封装在其中的代码将引发错误
isPlatformBrowser
已在服务器端呈现。如何在不进行预渲染的情况下在客户端有效地强制执行此代码,而其他与服务器端预渲染正常工作的代码却要在服务器端进行预渲染?
这是我的组件,其传单代码封装在条件块中,用于检查平台是否为浏览器。
import {Component, OnInit, Inject} from '@angular/core';
import { PLATFORM_ID } from '@angular/core';
import { isPlatformBrowser, isPlatformServer } from '@angular/common';
import * as L from 'leaflet';
@Component({
selector: 'leaflet-map',
templateUrl: 'leaflet-map.component.html',
styleUrls: ['leaflet-map.component.css', '../../../..//node_modules/leaflet/dist/leaflet.css'],
})
export class LeafletMapComponent implements OnInit {
constructor(@Inject(PLATFORM_ID) private _platformId: Object) { }
ngAfterViewInit() {
}
ngOnInit() {
if (isPlatformBrowser(this._platformId)) {
L.map('leafletMap').setView([50.08, 19.93], 13);
}
if (isPlatformServer(this._platformId)) {
// Server only code.
// https://github.com/angular/universal#universal-gotchas
}
} …Run Code Online (Sandbox Code Playgroud)