노드

2016-06-30 3 views
2

에서 변수/모델을 변경할 때 각도 2가 UI를 업데이트하지 않습니다. 전자로 각도 2를 사용하고 있습니다. 기본적으로 노드 및 웹 기술을 사용하여 GUI를 만듭니다.노드

내가 원하는 것은 현재 디렉토리의 파일을 나열하는 것입니다.

"this.files"변수는 UI에 표시된 데이터를 업데이트하는 것처럼 보이지 않습니다. 그러나 놀랍게도, 빈 방법에 연결된 더미 버튼을 클릭하면 갑자기 업데이트됩니다. 이 문제를 어떻게 해결할 수 있습니까? 문제는 무엇입니까?

+0

'showFiles()'의 기능은 무엇입니까? –

+0

말 그대로 코드에는 아무 것도 없습니다. 그러나 UI를 클릭하면 어떤 이유로 모든 파일이 표시됩니다. –

+2

클릭 할 때 작동하는 이유 : 클릭 이벤트는 Angular 's 영역에 의해 원숭이 패치되므로 클릭 이벤트 핸들러가 실행 된 후 모든 템플릿 데이터 바인딩이 검사됩니다. 마지막 검사 이후'files '가 변경되었으므로 뷰가 업데이트됩니다. Electron이 어떻게 작동하는지 모르겠지만 @ Günter가 이미 대답했듯이 Node.js의 비동기 이벤트는 원숭이 패치가 아니기 때문에'readdir' 콜백이 실행될 때 Angular 변경 감지가 트리거되지 않습니다. –

답변

4

아마도 fs.readdir이 원인 일 수 있습니다. 그것은 각도 영역에 의해 패치되지 않은 API를 사용하는 것 같습니다. 해결할 수 있습니다

export class FilesComponent { 
    constructor(private cdRef:ChangeDetectorRef) {} 

    loadFiles() { 
    fs.readdir(this.cwd, (err, dir) => { 
     for (let filePath of dir) { 
      console.log(filePath); 
      this.files.push(filePath); 
     } 
     this.cdRef.detectChanges(); 
    }); 
    } 
} 
+0

더 자세히 설명해 주시겠습니까? 이전에'ChangeDetectorRef'를 본 적이 없습니다. 링크가 도움이 될 것입니다. 그러나이 문제가 해결되었습니다. 고마워요! –

+2

@YahyaUddin, https://angular.io/docs/ts/latest/api/core/index/ChangeDetectorRef-class.html#!#detectChanges-anchor. –