asiragusa/extjs-bundle

使用ExtJs配合Symfony 2

安装: 58

依赖者: 1

建议者: 0

安全性: 0

星星: 0

关注者: 1

分支: 18

语言:JavaScript

类型:symfony-bundle

2.3.1 2013-07-04 03:46 UTC

This package is not auto-updated.

Last update: 2024-09-24 07:06:54 UTC


README

使用ExtJs配合Symfony 2

Build Status

Packagist: https://packagist.org.cn/packages/tpg/extjs-bundle

该包的目的是简化Symfony 2与ExtJS客户端框架之间的集成。它支持

  • 基于服务器端实体/模型动态生成Ext.data.Model。
  • 自动集成Ext Remoting与Symfony 2控制器。
  • 为实体生成Rest Controller代码,支持GET、POST、PUT、PATCH和DELETE。

要求

必须

  • Symfony 2.3.*
  • JMS 0.13.*序列化库
  • Doctrine ORM或ODM
  • Sensio 2.3.*生成器

可选

  • Rest Controller代码生成需要FOSRestBundle 0.12.*

安装

使用composer

$ composer require tpg/extjs-bundle

启用包

<?php
// app/AppKernel.php

public function registerBundles()
{
    $bundles = array(
        // ...
        new JMS\SerializerBundle\JMSSerializerBundle(),
        new \Tpg\ExtjsBundle\TpgExtjsBundle(),
    );
}

添加路由规则

# app/config/routing.yml
tpg_extjs:
  resource: "@TpgExtjsBundle/Resources/config/routing.yml"
  prefix:   /extjs

以下所有文档,我们假设所有ExtJs控制器路径以/extjs为前缀。

配置

tpg_extjs:
    entities:
        - @AcmeDemoBundle/Entity/
        - @AcmeDemoBundle/Model/Auto
    remoting:
        bundles:
            - AcmeDemoBundle

测试运行

单元测试使用PHPUnit和Jasmine JS编写。如何在.travis.yml文件中运行单元测试。

模型/实体代码生成

您可能需要为此功能配置额外的路由规则。要生成Ext.data.Model代码,只需包含指向generateModel.js的脚本标签即可

要生成配置中配置的所有实体和文档

<script type="text/javascript" src="/extjs/generateModel.js"></script>

要生成一些特定的实体

<script type="text/javascript" src="/extjs/generateModel.js?model[]=Acme.DemoBundle.Entity.Person&model[]=Test.TestBundle.Model.Book"></script>

Acme.DemoBundle.Entity.Person和Test.TestBundle.Model.Book是模型的完整命名空间,只需将斜杠(%)替换为点(.)。

实体类必须使用Tpg\ExtjsBundle\Annotation\Model进行注解,请查看Tpg/ExtjsBundle/Tests/Fixtures/Test/TestBundle/Model/*.php以获取示例用法。

有一个Twig扩展(extjs_model),可以轻松将模型包含/加载到当前页面。

要生成并注入当前页面的ExtJS代码

{{ extjs_model(true, 'Acme.DemoBundle.Entity.Person', 'Test.TestBundle.Model.Book') }}

要通过脚本标签引用和加载ExtJS代码

{{ extjs_model(false, 'Acme.DemoBundle.Entity.Person', 'Test.TestBundle.Model.Book') }}

远程集成

您需要配置远程参数,以便ExtJs Remoting与控制器协同工作。

要生成页面上远程集成的粘合剂,只需包含

<script type="text/javascript" src="/extjs/remoteapi.js"></script>

要使控制器操作可远程访问,您需要使用Tpg\ExtjsBundle\Annotation\Direct对函数进行注解。

如果控制器参数期望Symfony\Component\HttpFoundation\Request对象,那么您需要使用只有一个参数的远程API调用。您需要将参数包装在数组中。

public function testRequestParamAction(Symfony\Component\HttpFoundation\Request $request) {
    $idResult = $request->query->get("id");
    $nameResult = $request->query->get("name");
}

$idResult将包含12,$nameResult将包含"EFG"。

要调用该远程API,您需要使用。

Test.testRequestParam({"id":12, "name":"EFG"});

Rest Controller代码生成

Rest Controller代码生成是Sensio控制器生成器的扩展。生成的控制器将扩展FOS\RestBundle\Controller\FOSRestController类。

您需要启用以下包。

new \JMS\SerializerBundle\JMSSerializerBundle(),
new \FOS\RestBundle\FOSRestBundle(),

您还需要确保以下fos_rest配置。

fos_rest:
    service:
        serializer: tpg_extjs.serializer
    routing_loader:
        default_format: json
    param_fetcher_listener: true

生成的控制器在序列化和反序列化过程中设置不同的JMS序列化器上下文组。

  • get: 在GET、POST、PUT、PATCH操作期间对单个实体进行序列化。
  • list: 在GET操作期间对实体列表进行序列化。
  • post: 在POST操作期间对单个实体进行反序列化。
  • put: 在PUT操作期间对单个实体进行反序列化。
  • patch: 在PATCH操作期间对单个实体进行反序列化。

例如,

为实体Acme.DemoBundle.Entity.Person生成一个Rest控制器(PeopleController)

php app/console generate:rest:controller --controller AcmeDemoBundle:People --entity AcmeDemoBundle:Person

实体中的属性需要指定JMS类型,以便反序列化能够正常工作。

只需控制器和实体选项是必需的,其余选项都可以留为默认值。生成器将创建/更新两个文件

  • Acme\DemoBundle\Controller\PeopleControler将被生成。
  • 将更新或创建 Acme\DemoBundle\Resources\config\routing.rest.yml

要将生成的rest控制器包含到路由表中,只需包含

# app/config/routing.yml
acmedemo_api_rest:
  resource: "@AcemeDemoBundle/Resources/config/routing.rest.yml"
  prefix: /api
  type: rest

使用 generate:rest:controller 命令并带 --trait 选项时,生成器会为您生成两个类,

  • 特质控制器类
  • 实际控制器类

将生成的代码和控制器中的自定义实现分开。这将允许您在不影响自定义实现的情况下重新生成控制器。

在Symfony中将ExtJS Rest Proxy与Rest控制器连接

要在extjs模型中指定rest代理,您需要

// in file Acme\TestBundle\Entity\Car.php
/**
 * @Extjs\Model
 * @Extjs\ModelProxy("/api/cars")
 * @ORM\Entity
 * @ORM\Table(name="car")
 */
class Car {
...