Проблемы с HTML5 аудио и угловым двусторонним связыванием с использованием ngSanatize

Question

Я пытаюсь создать динамический плейлист, который вытаскивает файл .mp3 из массива и динамически помещает его в звуковой тег. Ознакомьтесь с демо здесь:

http://plnkr.co/edit/NYKwAY?p=preview

Сначала я получил ошибки консольных о том, что:

Blocked загрузка ресурсов из URL не допускается политикой $ sceDelegate

Но я получил вокруг этого, используя ngSantatize, и консоль больше не выдавала эти ошибки. Единственная проблема заключается в том, что mp3-файл STILL не хочет играть. Единственная ошибка, которую дает консоль от углового аудио-плеера:

Если вы используете атрибут списка воспроизведения, вам нужно $ scope.playlistVariable = []; в вашем коде

Любые идеи о том, как сделать эту работу угловатой? Я неправильно реализую ngSanatize?

Answer 1

Я думаю, что проблема заключается в том, что вам нужно вернуть $sce.trustAsResourceUrl(url), как вещь, которая втягивается в src. Кроме того, ng-src будет хранить мгновенные ошибки при попытке загрузить "{{whatever}}".

Я решил попробовать сделать one from scratch, используя ионный, как у вас есть, для разнообразия игры с некоторыми простыми концепциями. Он загружает фид NPR и отображает хороший плейлист. Я не знаю, буду ли я называть это «правильным путем», но я решил упростить настройку, привязывая очень мало управления и пытаясь получить углы, чтобы выполнять большую часть работы. Это не идеально, но это должно заставить вас начать.

В общем, в любом случае, я обычно решаю, что если у меня есть много настроек «код управления» &, что-то происходит, и т. Д., Вероятно, я не использую его правильно. Я пытаюсь понять «запах» хорошего кода или базовый стиль людей, которые являются хорошими примерами в сообществе, чтобы получить представление о том, как эффективно делать вещи. В угловой форме кажется, что основная цель состоит в том, чтобы сохранить бизнес-логику из HTML, но многократно используемую логику пользовательского интерфейса в качестве директив (атрибуты & элементов) с минимальными контроллерами для их склеивания и предоставления услуг для предоставления данных.

Также, here - отличная директива, которая делает то, что я думаю, что вы надеетесь достичь.