Журналы консоли Angular JS правильные, но нет вывода

У меня есть электронное приложение, которое должно проходить по каталогу и отображать содержимое каталога на боковой панели навигации.

Я использую эту библиотеку для обхода каталога. Я получаю правильный вывод консоли, как показано ниже, но я предполагаю, что делаю что-то не так, поэтому я вижу вывод на странице html.

введите здесь описание изображения

Код для файла, который ходит по каталогу,

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;

});

При получении данных области я пытаюсь просмотреть данные, используя ng-repeat, но, похоже, я делаю это неправильно, потому что не вижу результата. Что я делаю не так?

<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>

Весь код находится на github.


node.js javascript angularjs fs fs-extra
person 0xtvarun    schedule 11.09.2016    source источник

Ответы (2)


arrow_upward
2
arrow_downward

Так должно быть:

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

Это обычный JavaScript, и для доступа к элементу нам нужно сделать это (то же самое в Angular):

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

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

person Mohammad Kermani    schedule 11.09.2016

arrow_upward
1
arrow_downward

Из вывода, который я вижу в консоли, вы перебираете массив объектов, каждый из которых имеет свойство "song", которое вы пытаетесь отобразить. Разве вы не должны печатать {{song.song}} вместо {{song}}? Поскольку {{song}} указывает на литерал объекта, такой как {song: ...}.

person EternalLight    schedule 11.09.2016
comment
Кстати, вы, вероятно, захотите добавить дополнительную проверку, не является ли текущий элемент каталогом и находится ли его расширение в списке поддерживаемых (MP3, WAV, OGG и т.д.) - person EternalLight; 11.09.2016
comment
Да, я подумал об этом, спасибо - person 0xtvarun; 11.09.2016