更改不会通过组件传播答案

【问题标题】：Changes don't propagate through the component更改不会通过组件传播
【发布时间】：2018-05-21 13:47:43
【问题描述】：

我有以下组件示例，该组件在单击按钮时切换元素 (div)。问题是第一次单击绝对没有任何作用：更改根本不会传播，需要第二次单击才能实现所需的行为。

import { Component } from '@angular/core';

var exec = require('child_process').exec; //electron part

@Component({
    selector: 'my-component',
    template: `

        <button (click)="showDiv()">Toggle Div</button>
        <div *ngIf="show" style="width: 50px; height: 50px; background-color: green">
        </div>

    `
})
export class MyComponent {

    private show = false;

    public showDiv() {

        exec("wmic logicaldisk get caption", function(error, stdout, stderr){
            console.log(stdout);
            this.show = !this.show;
        }.bind(this));

    }

}

因此，当我尝试使用电子包执行 Windows 命令提示符命令（即 wmic logicaldisk get caption）并在命令返回其值后更新组件时，会发生棘手的部分。
在使用电子 (exec("copy a.txt dir", function(error, stdout, stderr){...})) 复制某些文件的情况下，并且在操作结束后，我的组件需要更新为某些状态（假设：文件复制成功！），此解决方案将不起作用。
那么这种方法有什么问题呢？

【问题讨论】：

标签： javascript angular electron

【解决方案1】：

当我们改变任何东西的角度时，角度不考虑它。尝试使用ngZone（我不知道是否有效）

export class MyComponent {
    private show = false;
    constructor(private ngZone:NgZone) //<--ID NgZone
    public showDiv() {
        exec("wmic logicaldisk get caption", function(error, stdout, stderr){
            console.log(stdout);
            this.ngZone.run(()=>{
              this.show = !this.show;
             });
        }.bind(this));
    }
}

【讨论】：