Skip to content

Instantly share code, notes, and snippets.

View malerba118's full-sized avatar

Austin Malerba malerba118

View GitHub Profile
1 1 1 1 1 1 1 3 4 2 2 3
<html lang="en">
<head>
<title>AngularJS Demo</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href='https://fonts.googleapis.com/css?family=Open+Sans:400' rel='stylesheet' type='text/css'>
<link href="styles.css" rel='stylesheet' type='text/css'>
</head>
<body ng-app="DemoApp" ng-cloak>
var app = angular.module('DemoApp', ['ui.router']);
app.config(function($stateProvider, $urlRouterProvider) {
$stateProvider
.state('root', {
name: 'root',
url: '',
templateUrl: 'root-partial.html',
controller: 'RootController'
})
<header>
<h1>AngularJS Demo App</h1>
<h2>Consuming an API with AngularJS</h2>
</header>
<div id="content">
<div id="note-list">
<div
class="note-list-item"
ng-repeat="note in notes"
app.controller('RootController', function( $scope ) {
$scope.notes = [
{
"userId": 1,
"id": 1,
"title": "sunt aut facere repellat provident occaecati excepturi optio reprehenderit",
"body": "quia et suscipit\nsuscipit recusandae consequuntur expedita et cum\nreprehenderit molestiae ut ut quas totam\nnostrum rerum est autem sunt rem eveniet architecto"
},
{
"userId": 1,
html, body
{
background: #F9F7F6;
font-family: 'Open Sans';
font-size: 12px;
line-height: 1.25;
}
header
{
app.service("NoteService", function($http, $q) {
this.getNotes = function() {
return $http.get("https://jsonplaceholder.typicode.com/posts")
.then(
//success
function(response) {
return response.data;
},
//error
app.controller('RootController', function( $scope, NoteService ) {
NoteService.getNotes().then(
//success
function(notes) {
$scope.notes = notes;;
},
//error
function(error) {
console.log(error);
<h2>{{note.title}}</h2>
<p>{{note.body}}</p>
<img ng-show="resolved.preloader == false" id="preloader" src="preloader.gif"/>
app.controller('NoteDetailController', function( $scope, $stateParams, NoteService ) {
$scope.resolved = {};
$scope.resolved.preloader = false;
NoteService.getNote($stateParams.noteId).then(
//success
function(note) {
$scope.note = note;