(* As my previous question has been more or less answered, and the code has evolved, I open a new question. *)
I want to build a simple playground with MEAN stack that mimics plunker: we have a list of files and a textarea on the left hand, and a live preview on the right hand. Note that the files are saved in a temporary folder, and the live preview is an iframe
injected by the files from that temporary folder.
********** what I have written **********
In the html file, I add one controller per file, so that I could track exactly which file is changed in the textarea. Then, I just need to save that file to the server, rather than all the files:
<div ng-repeat="file in files track by $index" ng-controller="fileCtrl">
<a ng-click="go(file)">{{file.name}}</a>
</div>
the controller:
app.controller('fileCtrl', ['$scope', 'codeService', function ($scope, codeService) {
$scope.$watch('file', function () {
codeService.render($scope.files, $scope.file);
}, true);
}]);
the codeService
:
app.service('codeService', ['$http', function ($http) {
this.render = function (files, changedFile) {
$http.post('/writeFile', changedFile);
};
}]);
the router:
router.post('/writeFile', function (req, res, next) {
var file = req.body;
var fs = require('fs');
fs.writeFile("public/tmp/" + file.name, file.body, function (err) {
if (err) { return console.log(err) };
});
});
********** my tests **********
My tests show that the modification in the textarea is well caught, and the modified file can more or less be saved to the server: it works quite well for the 1st, 2nd writings, but it often has trouble for the writings that follow.
********** my questions **********
Could anyone help me re-structure the code to handle well:
- asynchronous calls of writings, such that all the writings are well (and fast) undertaken.
- writings with
debounce
, that means we could wait a little bit before each saving. But it's a little bit tricky when we have several files: assume we could switch among files very fast, how woulddebounce
and asynchronous saving perform in that case?