Question

我有一个组件的示例，当单击按钮时切换元素（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){...})）复制某些文件的情况下，在操作结束后，我的组件需要更新一些状态（让我们说：文件已成功复制！），此解决方案赢了＆＃ 39;工作。
那么这种方法可能有什么问题呢？

Answer 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));
    }
}

更改不会通过组件传播

1 个答案: