本文共 1138 字，大约阅读时间需要 3 分钟。

我们打开一个Angular应用，发现其渲染页面里的DOM元素，包含了形如_nghost-, 以及_ngcontent-这种属性。

这些属性在platform-browser.js的DomRenderer2里生成，具体位置在shimContentAttribute和shimHostAttribute函数内：

class EmulatedEncapsulationDomRenderer2 extends DefaultDomRenderer2 {
       /**     * @param {?} eventManager     * @param {?} sharedStylesHost     * @param {?} component     * @param {?} appId     */    constructor(eventManager, sharedStylesHost, component, appId) {
           super(eventManager);        this.component = component;        /** @type {?} */        const styles = flattenStyles(appId + '-' + component.id, component.styles, []);        sharedStylesHost.addStyles(styles);        this.contentAttr = shimContentAttribute(appId + '-' + component.id);        this.hostAttr = shimHostAttribute(appId + '-' + component.id);    }

const COMPONENT_REGEX = /%COMP%/g;/** @type {?} */const NG_DEV_MODE = typeof ngDevMode === 'undefined' || !!ngDevMode;/** @type {?} */const COMPONENT_VARIABLE = '%COMP%';/** @type {?} */const HOST_ATTR = `_nghost-${
     COMPONENT_VARIABLE}`;/** @type {?} */const CONTENT_ATTR = `_ngcontent-${
     COMPONENT_VARIABLE}`;

更多Jerry的原创文章，尽在：“汪子熙”:

转载地址：https://jerry.blog.csdn.net/article/details/112391112 如侵犯您的版权，请留言回复原文章的地址，我们会给您删除此文章，给您带来不便请您谅解！