Angular + NodeJS：使用Promise（fs.fileRead和fs.readdir）從文件夾讀取文件

Question

我正在嘗試使用NodeJS和Angular從文件夾讀取文件。我可以迭代文件夾並訪問文件數據，這裏沒有問題。 我的主要問題是我無法將結果（名稱數組）傳遞給$ scope並將其顯示給用戶 - 數組始終爲空。我認爲這與fs異步行爲有關。

我做了以下內容：

角服務：

myApp.service('peopleService', ['$q', '$http', function($q, $http) { 

    var self = this; 
    this.people = []; 

    var peopleService = new Promise(function(resolve, reject) { 
     fs.readdir(folderPath, function(err, files) { 
      files.forEach(function(file) { 
       var obj; 
       fs.readFile(filePath, 'utf8', function (err, data) { 
        obj = JSON.parse(data); 

        var person = { name: obj.obituary.name, ... }; 

        self.people.push(person); 
       }); 
      }); 
     }); 

     resolve(self.people); 
    }).then(function(people) { 
     return people; 
    }); 

    return peopleService; 
}]); 

角控制器：

myApp.controller('homeController', ['$scope', '$http', 'peopleService', function($scope, $http, peopleService) { 

    $scope.people = []; 

    peopleService.then(function(people) { 
     $scope.people = people; 
     console.log($scope.people); //empty array (Array[0]) 
    }); 

}]); 

角頁：

<div class="list-group"> 
    <a href="#" class="list-group-item" ng-repeat="person in people"> 
     {{person.name}} 
    </a> 
</div> 

我在做什麼錯？

Answer 1

爲什麼你將nodeJS代碼與angularJS代碼混合？

問題resolve(self.people)是readdir之前執行和readFile回調被執行，因爲他們是異步的，所以你必須確保resolve(self.people)會後readdir和readFile回調執行：

new Promise(function(resolve, reject) { 
     fs.readdir(folderPath, function(err, files) { 
      var count = 0; 
      files.forEach(function(file) { 
       var obj; 
       fs.readFile(filePath, 'utf8', function (err, data) { 
        obj = JSON.parse(data); 

        var person = { name: obj.obituary.name, ... }; 

        self.people.push(person); 

        count++; 
        if(count === files.length){ 
         resolve(self.people); 
        } 
       }); 
      }); 
     }); 

    }).then(function(people) { 
     return people; 
    });