emeric0101/phpangular

A complete framework for php and typescript with angular and Doctrine


License
Apache-2.0

Documentation

PHPAngular alpha 0.1

The simpliest way to angularise the world !

Changelog

  • Using php-di for injection (you must update the api.php into /web)

Todo

  • Using php-di for dependency injection
  • EntityManager client side
  • Entity generator from server client side
  • RepositoryService client side
  • Custom method call by the repository service to get data from server
  • Post array recursivly for the request class on server
  • Right management
  • Possibility to combine find request from js to avoid multiple network call
  • Possibility to combine save request from js
  • Unit test with Yasmine

Samples

This website uses my library: https://www.amelieferrari.fr

Installation

Composer config

Define all namespace we will use for Entity in composer.json (you can use the namespace you want but it must be like XX\XX\Entity, and other class you may need like Controller, Service, ...)

"psr-4": { "Emeric0101\\PHPAngular\\Entity\\": "src/Entity/" }

Use composer with composer require phpangular

boostrap.php

You need to setup the mysql and the namespace login settings in yourapp/bootstrap.php Set your targetEntity, this is the name of your bundle, every Entities must be in this namespace but with "Entity" after For example, the vendor name is Emeric, the bundle name is test, the entity is Post, you should have Emeric\test\Entity\Post

Doctrine

Now you have to create the Entity with doctrine Create Entities ** You must use Annotation**

Every entity have to derived from Emeric0101\PHPAngular\Entity\EntityAbstract

You can use all association with doctrine you want !

Then you can use doctrine to create the mysql database with doctrine orm:schema-tool:create

PHPAngularisation !

Run the script

phpangular install

`cd web

bower install `

Then tsc (you will get some error but don't worry, the system works and i'm working to fix this)

Usage

The script has created a web folder. This folder contains all public data accessible from web (Typescript, html, ...). In the folder src, all php source files have been generated by the script.

In fact, most of the code are in the web/js and in the web/template folders. In the src folder, you will just need to set all post operation (with right check !!!)

PHP Controller

For instance, we admit that you have created a Entity called TestVendor\TestBundle\Message which have a title(string) and a description(string). So we will need a controller in the server side to save the entity, of get some entity with parameters.

Some controller function has been already implemented : findAll and findById so you don't need to implemented them.

Create a folder src/Controller then create a file Message.php

<?php
namespace TestVendor\TestBundle\Controller;
use Emeric0101\PHPAngular\Controller\Entity;
use Emeric0101\PHPAngular\Service\DbService;
use TestVendor\TestBundle\Entity\Message as EntityMessage;
class Message extends Entity {

    public function post($id = 0) {
        $entityMessage = $this->entityManager->find("TestVendor\TestBundle\Entity\Message", $id);
        if ($entityMessage === NULL) {
            $entityMessage = new EntityMessage();
        }
        // Get from POST
        $title = $this->request->postFromArray("Message",'title', ''));
        $desription = $this->request->postFromArray("Message",'description', ''));

        $entityMessage->setTitle($title);
        $entityMessage->setDescription($description);
        $this->entityManager->persist($entityMessage);
        $this->entityManager->flush();
        $this->response->setResponse("Message", $entityMessage);
        return true;
    }
}

The class Message derived from Entity which implements all entity controller basic functions. If you only need a controller, you can derived from Emeric0101\PHPAngular\Controller\Controller class. When an object is save from Typescript, the post function is called with the $id (0 if it is a new object). In this method, first we try to find the object into the db with the id, else we create a new one.

The entity Manager of doctrine is accessible with $this->entityManager For getting data from GET, SESSION, COOKIE or POST, you can use the servier Request ($this->request).

public function post($name, $default);
public function get($name, $default);
public function cookie($name, $default);
public function session($name, $default);
public function postFromArray($arrayName, $name, $default);

The $name is the index of the var requested. $default is the default value (in case of non correct data). $default MUST be the same TYPE as the variable request (string, number, ...) With the method postFromArray you can get a var extract from an array from Post. This method is used to get value from TypeScript Entity Manager.

The rest of the method is same as doctrine

Front-end

After running PHPAngular.bat, some files are created in the web folder. In web/js/Entity, you find all entities from doctrine. The default controller is "home" (template/home/home/home.html), but we provided a demo controller to help you to create this one. All routes, entities management, ... are provided by PHPAngular so you just need to create template and controller in order to build your app.

Routing

The route is easy to use : url/folder1/folder2 will call the template into template/folder1/folder2/folder2.html. If folder2 is not provided, folder1 will be repeated.

In web/template/home/home/, we find a sample controller and a template.

module Emeric0101.PHPAngular.Controller {
    class MainController {
        message : TestVendor.TestBundle.Message = null;
        messages : TestVendor.TestBundle.Message[] = [];
        static $inject = ['UrlService', 'EntityManager', 'EntityFactory', 'RepositoryService'];
        getMessage() {
            this.$repo.findAll('Message', (messages) => {
                this.messages = <TestVendor.TestBundle.Message[]>messages;
            };
        }
        createMessage() {
            this.message = this.$ef.create('Message');
            this.message.setTitle("test");
            this.message.setDescription("test");
            this.$em.persist(this.message);
            this.$em.flush();
        }
        constructor(
            private $url : Emeric0101.PHPAngular.Service.UrlService,
            private $em : Emeric0101.PHPAngular.Service.EntityManager,
            private $ef : Emeric0101.PHPAngular.Service.EntityFactory,
            private $repo : Emeric0101.PHPAngular.Service.RepositoryService
        ){

        }
    }
    phpangularModule.controller("MainController", MainController);

}

The entityManager is like doctrine entityManager (so it automaticly persists all entities linked to)

You can use MainController::message directly as ng-model in the template (ng-model="ctrl.message.title")

For using this controller into the template, you just need to call it with ng-controller="MainController as ctrl".

Custom query

You may use custom query to get entities from the server. The repository service permits you to do this by the method findSome

findSome(
    method: string, // The method you want into the controller
    name : string, // The controller to call in the server (MUST BE THE SAME NAME THAN THE ENTITY REQUESTED)
    id: number, // Args to pass to the controller
    params: any, // Get params to the controller (if id is not enough)
    callback : (obj : any[]) => void, // callback to call after (because async)
    error? : () => void
) {

In the controller (PHP) :

public function someFunction($id = 0) {
    if ($id == 0) {
        $this->response->setError("missing id");
        return false;
    }
    $message = $this->entityManager->find("TestVendor\TestBundle\Entity\Message", $id);
    $this->response->setResponse('Message', $message);
}

Obviously, this method is useless because it does exactly the same as findById().