Angular 无法读取属性'；getElementsByTagName'；在使用ngxPrint在隐藏div中打印int内容时返回null 我的html 打印 我的 ngOnInit（）{ this.isShown=false； }

如果我将

isShown

设置为false，为什么不能打印div内容。

指令

*ngIf

是指令

[ngIf]

的语法糖。所以你的模板实际上会扩展到

ng模板

是更通用的HTML

模板

标记的角度特定实现。因此，正如您看到的，当条件为false时，

div

不会像您所说的那样隐藏，而是尚未渲染。因此，当您尝试

getElementsByTagName

时，该元素还不可用

作为一种解决方法，您可以使用CSS来隐藏元素，而不是

*ngIf

。试试下面的方法

---

使用

[hidden]=“true”

而不是

*ngIf=“isShown”

，它会起作用。

app.component.html-

<div [hidden]="true" id="print-section"> 
  <h1>HELLO WORLD!!!</h1>
</div>
<button printTitle="MyTitle"  printSectionId="print-section" ngxPrint>print</button>

app.module.ts-

@NgModule({
declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    NgxPrintModule,
    AppRoutingModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

package.json-

"dependencies": {
    "@angular/animations": "~10.1.3",
    "@angular/common": "~10.1.3",
    "@angular/compiler": "~10.1.3",
    "@angular/core": "~10.1.3",
    "@angular/forms": "~10.1.3",
    "@angular/platform-browser": "~10.1.3",
    "@angular/platform-browser-dynamic": "~10.1.3",
    "@angular/router": "~10.1.3",
    "ngx-print": "^1.2.0-beta.5",
    "rxjs": "~6.6.0",
    "tslib": "^2.0.0",
    "zone.js": "~0.10.2"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.1001.3",
    "@angular/cli": "~10.1.3",
    "@angular/compiler-cli": "~10.1.3",
    "@types/node": "^12.11.1",
    "@types/jasmine": "~3.5.0",
    "@types/jasminewd2": "~2.0.3",
    "codelyzer": "^6.0.0",
    "jasmine-core": "~3.6.0",
    "jasmine-spec-reporter": "~5.0.0",
    "karma": "~5.0.0",
    "karma-chrome-launcher": "~3.1.0",
    "karma-coverage-istanbul-reporter": "~3.0.2",
    "karma-jasmine": "~4.0.0",
    "karma-jasmine-html-reporter": "^1.5.0",
    "protractor": "~7.0.0",
    "ts-node": "~8.3.0",
    "tslint": "~6.1.0",
    "typescript": "~4.0.2"
  }

输出-

---

从下面的代码中获取相同的“getElementsByTagName”错误@Michael D-

你好，世界
打印
得到相同的错误是什么意思？我说过，
*ngIf
将在内部扩展到此版本，这就是错误的实际原因。我的解决方案是使用
[style.display]
类似于回答中所示的
[hidden]
。
"dependencies": {
    "@angular/animations": "~10.1.3",
    "@angular/common": "~10.1.3",
    "@angular/compiler": "~10.1.3",
    "@angular/core": "~10.1.3",
    "@angular/forms": "~10.1.3",
    "@angular/platform-browser": "~10.1.3",
    "@angular/platform-browser-dynamic": "~10.1.3",
    "@angular/router": "~10.1.3",
    "ngx-print": "^1.2.0-beta.5",
    "rxjs": "~6.6.0",
    "tslib": "^2.0.0",
    "zone.js": "~0.10.2"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.1001.3",
    "@angular/cli": "~10.1.3",
    "@angular/compiler-cli": "~10.1.3",
    "@types/node": "^12.11.1",
    "@types/jasmine": "~3.5.0",
    "@types/jasminewd2": "~2.0.3",
    "codelyzer": "^6.0.0",
    "jasmine-core": "~3.6.0",
    "jasmine-spec-reporter": "~5.0.0",
    "karma": "~5.0.0",
    "karma-chrome-launcher": "~3.1.0",
    "karma-coverage-istanbul-reporter": "~3.0.2",
    "karma-jasmine": "~4.0.0",
    "karma-jasmine-html-reporter": "^1.5.0",
    "protractor": "~7.0.0",
    "ts-node": "~8.3.0",
    "tslint": "~6.1.0",
    "typescript": "~4.0.2"
  }