Angular 4 Universal this.html.charCodeAt不是函數

我正在使用Angular 4 Universal Starter，並將我所有的Angular 2代碼都集成到了此啓動器中。一切工作正常，但在終端我得到這個奇怪的錯誤。不知道是什麼問題Angular 4 Universal this.html.charCodeAt不是函數

ERROR TypeError: this.html.charCodeAt is not a function at Preprocessor.advance (/home/user/node/project/dist/server.js:152260:24) at Tokenizer._consume (/home/user/node/project/dist/server.js:45694:30) at Tokenizer.getNextToken (/home/user/node/project/dist/server.js:45652:23) at Parser._runParsingLoop (/home/user/node/project/dist/server.js:102429:36) at Parser.parseFragment (/home/user/node/project/dist/server.js:102384:10) at Object.parseFragment (/home/user/node/project/dist/server.js:55136:19) at Parse5DomAdapter.setInnerHTML (/home/user/node/project/dist/server.js:53609:49) at Parse5DomAdapter.setProperty (/home/user/node/project/dist/server.js:53250:18) at EmulatedEncapsulationServerRenderer2.DefaultServerRenderer2.setProperty (/home/user/node/project/dist/server.js:54766:94) at setElementProperty (/home/user/node/project/dist/server.js:9982:19)

及其下面的代碼在server.js造成由於

Preprocessor.prototype.advance = function() { 
    this.pos++; 

    if (this.pos > this.lastCharPos) { 
     if (!this.lastChunkWritten) 
      this.endOfChunkHit = true; 

     return $.EOF; 
    } 

    var cp = this.html.charCodeAt(this.pos); // Error Occurs here 

    //NOTE: any U+000A LINE FEED (LF) characters that immediately follow a U+000D CARRIAGE RETURN (CR) character 
    //must be ignored. 
    if (this.skipNextNewLine && cp === $.LINE_FEED) { 
     this.skipNextNewLine = false; 
     this._addGap(); 
     return this.advance(); 
    } 

    //NOTE: all U+000D CARRIAGE RETURN (CR) characters must be converted to U+000A LINE FEED (LF) characters 
    if (cp === $.CARRIAGE_RETURN) { 
     this.skipNextNewLine = true; 
     return $.LINE_FEED; 
    } 

    this.skipNextNewLine = false; 

    //OPTIMIZATION: first perform check if the code point in the allowed range that covers most common 
    //HTML input (e.g. ASCII codes) to avoid performance-cost operations for high-range code points. 
    return cp >= 0xD800 ? this._processHighRangeCodePoint(cp) : cp; 
};

this.html typeof將返回「串」，但之前出錯它返回下面的對象。

{ treeAdapter: 
    { createDocument: [Function], 
    createDocumentFragment: [Function], 
    createElement: [Function], 
    createCommentNode: [Function], 
    appendChild: [Function], 
    insertBefore: [Function], 
    setTemplateContent: [Function], 
    getTemplateContent: [Function], 
    setDocumentType: [Function], 
    setDocumentMode: [Function], 
    getDocumentMode: [Function], 
    detachNode: [Function], 
    insertText: [Function], 
    insertTextBefore: [Function], 
    adoptAttributes: [Function], 
    getFirstChild: [Function], 
    getChildNodes: [Function], 
    getParentNode: [Function], 
    getAttrList: [Function], 
    getTagName: [Function], 
    getNamespaceURI: [Function], 
    getTextNodeContent: [Function], 
    getCommentNodeContent: [Function], 
    getDocumentTypeNodeName: [Function], 
    getDocumentTypeNodePublicId: [Function], 
    getDocumentTypeNodeSystemId: [Function], 
    isTextNode: [Function], 
    isCommentNode: [Function], 
    isDocumentTypeNode: [Function], 
    isElementNode: [Function] } }

下面是我的通用server.ts

import 'zone.js/dist/zone-node'; 
import 'reflect-metadata'; 
import 'rxjs/Rx'; 
import * as express from 'express'; 
import { Request, Response } from 'express'; 
import { platformServer, renderModuleFactory } from '@angular/platform-server'; 
import { ServerAppModule } from './app/server-app.module'; 
import { ngExpressEngine } from '@nguniversal/express-engine'; 
import { ROUTES } from './routes'; 
import { enableProdMode } from '@angular/core'; 
enableProdMode(); 
const app = express(); 
const port = 4200; 
const baseUrl = `http://localhost:${port}`; 

app.engine('html', ngExpressEngine({ 
    bootstrap: ServerAppModule 
})); 

app.set('view engine', 'html'); 
app.set('views', 'src'); 

app.use('/', express.static('dist', {index: false})); 

// ROUTES.forEach((route: string) => { 
    app.get('/*', (req: Request, res: Response) => { 
    console.time(`GET: ${req.originalUrl}`); 
    res.render('../dist/index', { 
     req: req, 
     res: res 
    }); 
    console.timeEnd(`GET: ${req.originalUrl}`); 
    }); 
// }); 

app.listen(port,() => { 
    console.log(`Listening at ${baseUrl}`); 
});

Node: v6.9.2

Angular: 4.1.0

來源

2017-08-02 mohit

不顯示'server.js'的內容，你的問題不能解決。 –

@ShanevandenBogaard對不起，我剛剛更新了我的問題。我正在使用與angular 4通用啓動程序中給出的相同server.ts文件 – mohit

您可以檢查預處理程序實例中的「html」字段的類型。 –

我使用

<div [innerHTML]="someHtml"></div>

時遇到了同樣的錯誤，但我* ngIf = 「someHtml」解決它像這

<div *ngIf="someHtml" [innerHTML]="someHtml"></div>

希望這也適用於你！

來源

2017-08-16 12:30:09 Kungen

真棒！它的工作原理：D – mohit

Angular 4 Universal this.html.charCodeAt不是函數

回答

相關問題