Search code examples
javascriptangularjsnode.jsfsfs-extra

Angular JS console logs correct but no output

I have an electron app that is suppose to walk a directory and list the contents of the dir into side bar nav

I am using this library to walk the dir. I get the correct console output as shown below but I guess I am doing something wrong that I can see the output on html page.

enter image description here

The code for the file that is walking the directory is 

var fs = require('fs-extra');
var app = angular.module('music', []);

app.controller('ctrl', function($scope, $http) {
    var list = [];
    var _id = 0;
    fs.walk('/home/a0_/Music')
      .on('data', function(item) {
          list[_id] = {'song':item.path}
          _id = _id + 1;
        }
    )
      .on('end', function() {
          console.log(list);
          _id = 0;
      }
    );
    $scope.data = list;

});

On getting the scope data I am trying to loop through the data using ng-repeat but it seems I am not doing it right cause I cant see the output. What am I doing wrong?

<body ng-app="music">

    <div class="site-wrapper">
        <div class="col-sm-3 side-nav" ng-controller="ctrl">
            <h3><a href="#" data-toggle="modal" data-target="#myModal">Music</a></h3>
            <hr>
            <div ng-repeat="song in data">
                <a href="#">
                    {{ song }}
                </a>
            </div>
        </div>

The entire code is on github

Solution

  • It should be:

    <div ng-repeat="song in data">
     <a href="#">
       {{ song.song }}
     </a>
</div>

    It is common JavaScript and to access to an item we need to do this (same in Angular):

    var song = [{
  song: "test 1"
}, {
  song: "test 2"
}];

console.log(song[0].song);