Angular jest biblioteką javascript o dużych możliwościach, do zalet należy m. in. iterowanie HTML (pętle), obsługa Ajaxa i in.

Głównym jej celem jest oddzielenie kodów HTML od PHP – aplikacje PHP wykonują zapytania SQL i operacje na dysku, a następnie zwracają rezultat w postaci plików JSON (JavaScript Object Notation), to specjalne pliki do przechowywania tablic, tablic asocjacyjnych i in. zmiennych JS.

Program PHP wywoływany jest z AJAXA, a wyniki w postaci JSON dynamicznie podstawiane są w HTML bez potrzeby pisania pętli.

Przykład z listą plików o zadanej masce, w postaci linków, z bieżącego katalogu:
json_listaplikow.php

1
2
3
<?php
echo json_encode(glob("*.html")); //glob - zwraca tablicę z listą plików, a json_encode - formatuje jako JSON
?>

PHP zwraca JSON, dane w postaci podobnej do:

1
[ "1.html", "2.html", "index.html" ]

Aplikacja Angular do obsługi powyższych danych JSON

index.html

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
<html>
<head>
 <meta charset="utf-8">
 <title>Lista plików HTML</title>
 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
</head>
<body>
<h1>Lista plików *.html w Angular</h1>
 <div ng-app="myApp" ng-controller="customersCtrl">
  <ul>
   <li ng-repeat="plik in pliki"><a href="{{plik}}">{{plik}}</a></li>
    <!-- Tu^ jest pętla: ng-repeat.
   pliki- to tablica z danymi JSON,
   plik to zmienna sterująca przybierająca po kolei każdą wartość w tablicy pliki
   w html używa się podwójnych wąsów do wstawienia tej zmiennej sterującej-->          
  </ul>
 </div>
 <script>
 var app = angular.module('myApp', []);
 app.controller('customersCtrl', function($scope, $http) {
        $http.get("http://mojserwer/json_listaplikow.php") //Ajax
                .success( function(data, status, headers, config){ //funkcja wywołana po odczytaniu danych z PHP
                        $scope.pliki=data; //dane JSON z PHP zapisane w globalnej tablicy pliki
                });
 });
</script>
</body>
</html>
HTML + CSS, JavaScript, PHP