Angular.ITacademy.dk

opgave-using-template


Denne app ønskes lavet helt om fra jQuery til angularJS.
Funktionalitet og layout skal være det samme som det oprindelig version.

http://webapps.itacademy.dk/html5/WebApp.Bynavn/



jQuery var the state of the art denne gang jeg lavede denne app.

  • [1. krav] Nu ønsker vi løsning med Templates/Directives

  • [2. krav] Håndtering af fejl fra remote API ville være en optimal brugeroplevelse. I tilfælde af at en bruger indtaster ukendt postnummer f.eks. 9999 så skal Appen vise brugervenligt fejlbesked.

// Brug factory as a Service API som vist herunder:
// Eller endnu bedre $http med promise for at kunne håndtere fejl status 404

API  
.getBydata($scope.postnr)    
.success(function(data){ 
    $scope.results = data.navn
})
..... osv.....

Og her er løsningsforslag til definitionen af API:


Sådan kan .directive('byNavn' , ... ) se ud:

Evt. Kan man også sende parameter som attributes, hvis man ønsker at default sætte postnummer til en start værdi f.eks postnr="1000"



template.html er kun til inspiration. Det er op til dig hvor meget logic du ønkser at tilføje for at kunne håndtere evt. fejl indtastede postnummer.


  • venligst vis vejret som et billede fra DMI

DMI står for at levere images om vejret i hele landet, hvis man kender PostNummer. Så kunne det være en god idé at tilføje til vores APP yderligere info om vejret i dag, som et billede

$scope.vejret = "http://servlet.dmi.dk/byvejr/servlet/byvejr_dag1?by=" + $scope.postnr + "&mode=long"

IMAGE-URL:
http://servlet.dmi.dk/byvejr/servlet/byvejr_dag1?by=1000&mode=long


Hvis tiden tillader !

Kan du finde offentlige REST API services i DK, som acceptere et postnummer som parameter og tilføje endnu mere værdi til denne app, som Point Of Interrest Service ?