[Homework] SPA with AngularJS - Controllers-and-Markup
След много копи-пейст, няколко тутотриала и видеа ето резултата:
ДЕМО - КОД Ъплоуд-а на видео работи само локално на node сървъра!
За скелет ползвам сийд-а от туториала в официалния сайт на Angular цък, който горещо препоръчвам. На 80% си направих нещата от там.Кода в демото е прекрасно обяснен и се минава за два часа. Идеята е да се направят отделни модули за контролерите и филтрите(в случая), които се слагат като депендансита в галвния ни модул на апп-а. В app.js освен модулите си инжектирам и сървисите(май е по-правилно провайдърите) за раутинг ngRoute, и за премахване секюрити(ескейпинг) ишутата ngSanitize , за които Angular така старателно се грижи. Там се конфигурира и на кои урл-та какви паршали да се зареждат, и кои контролери да отговарят за тях. Фактически в index.html има само едно ng-view в бодито, към което се залепят паршалите. Супер чисто и удобно.В js/controllers си правя модул за контролерите. Ползвам $http сървиса. Записвам видета в един videos.json файл. От него си ги гетвам при листване, а при добавяне взимам файла, пушвам новия обект в него, json.stringify-вам го, и чак тогава го поствам. Учудих се, че тръгна така без истински сървиси но... Естествено ъплоуд на видео работи само локално, защото няма кой да ми рънне node-ския сървър като си го хостна на ICN, а иначе това става от server.bat/sh файла. В js/flters имам модул за филтрите. Единия ползва $sce сървиса, за да ми позволи angular да ng-src-свам линковете за видеата. Понеже ползвам iframe(не намерих по-удачен начин) трябв да се линква ембедед-урл-а от ютуб. С другия филтър просто си дисплелйвам тикчета за true и false на hasSubtitles. Валидацията на формата беше голяма заигравка, особенно да е disabled submit бутона при неверен инпут. Ако не зададеш name и ng-model на инпутите angular влиза в конфликт с html валидатора и не могат да се разберат кой кво ше прави.
Отново проблем бяха датите. В json файла няма как да нбиеш new Date() и трябва да сложиш едно такова чудовище 1393134567877, и от него да си правиш после дата. Не можах по никакъв начин да разбера коя цифра за коя част от датата отговаря...никаква логика
Общо взето документация в официалния сайт според мен е супер добре направена и много полезна. Има и dvelopers guide tutorial, който сигурно е доста по-адвансд и полезен
Филтър по дата всъщност става точно като другите филтри, просто формата на датата която ни е дадена в json-а, незнам поради каква причина, но не бачка - изкарва я в друг формат, че даже е и грешна. Решението на това (поне аз само намерих) е както го е направил колегата в юникс формата на датата.
Филтъра за години незнма как мога да го подкарам.По принцип просто трябва да се направи един select tag с ng-model="filterByDate.date", със няколко option-и за различните години и във value атрибута да се подаде някакво число, което да отговаря за кокретната година <option value="2014">2014</option>. Накрая буташ едно | filter:filterByDate в лист айтъма за видео. Само, че коя част от това 1393034567877 в json-a отговаря за годината.....аре да не казвам
Незнам аз го направих като обикновен search, но незнам защо тези дати ми ги дава в невалидан формат аз въвеждам, 02 месец то ми връща 00.