使用像AngularJS框架Symfony2的单页面应用程序 [英] Symfony2 And Single Webpage Applications using a framework like AngularJS

查看:227
本文介绍了使用像AngularJS框架Symfony2的单页面应用程序的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

(如果不张贴这类问题的正确的地方我会高兴地将它张贴在其他地方)

我试图建立一个交互式Web应用程序来管理公司的资源。
我有Symfony2的经验,但我有点撞墙了这个新的应用程序。

I'm trying to build an interactive web application to manage company resources. I have experience with Symfony2 but I kind of hit a wall with this new application.

我想使这个应用程序在客户端上相当的互动。几乎整整一个单一的网页应用程序。
我的previous Web应用程序通常只用一个典型的MVC模式与CRUD页。

I'd like to make this application quite interactive on the client side. Almost a full single webpage application. My previous web applications would normally just use a typical MVC pattern with CRUD pages.

在这些简单的应用我会

/employees/
/employees/create
/employees/detail/45
/employees/update/45
/employees/delete/45

在这种应用中使用的symfony会给我很多的优点:

Using symfony in this kind of application would give me a lot of advantages:


  • 路由

  • 安全(CSRF令牌)

  • FormTypes和表单处理

  • 验证

  • 集成学说


特别喜欢这个功能在枝很清爽(,因为我的模特们打造的学说实体的):

Especially functionality like this in Twig was very refreshing (since my models were build as Doctrine entities):

<p>{{ employee.getCurrentTask().description }}</p>

我现在面临的问题是,我觉得Symfony2的是不是真的建立单一的网页应用程序。 当我尝试添加我面对这些问题的一些Ajax功能


  • CSRF令牌无效

  • 在jQuery的太多不可重复使用视图/ presentation逻辑

  • 在HTML中添加数据的属性获得的ID等...

然后我看着Knockout.js和Angularjs但后来我觉得像失去了所有的学说和嫩枝的优势。我反正重建我在客户端模式,必须维护他们在两个不同的地点即可。

I then looked into Knockout.js and Angularjs but then I feel like lose all of the advantages of Doctrine and Twig. I have to rebuild my models on the client side anyway and have to maintain them in two different locations then.

于是我想出了这个主意:

So I came up with this idea:


  • 使用Symfony2的模型和控制器留存数据到数据库,但让symfony的控制器只是发出JSON和接收JSON(FOSRestBundle也许?)

  • 使用像AngularJS或KnockoutJS一个框架,以重建在客户端的JSON数据使用2路绑定。

但后来我将如何应对像Doctrine2关系,表单验证,CSRF这Symfony的已经解决了,但不可用,如果我用一个前端JS框架的问题?

所有建议,欢迎!

推荐答案

关于JSON,序列化和模型有些话

西门,我面对完全一样的问题和困难。首先像肯已经提到。你并不需要重建的典范。更好地利用FosRestBundle和/或JMS串行。原来你实体关系到JSON对象。这个对象通过API传输到您的前端,你可以与他们的工作就像在树枝,当你使用这样的angular.js

Simon, I faced exactly the same questions and problems. First like ken already mentioned. You don't need to rebuild any model. Better use FosRestBundle and/or JMS Serializer. It turns you entities with relations into JSON objects. This objects are transferred via api to your frontend and you can work with them just like in twig, when you use angular.js like this

{[{ user.username }]}

是如在树枝相同。但请记住,你必须设置角度定制托架,因为在默认情况下它使用相同的树枝。

is as same as in twig. But remember that you have to set custom brackets for angular because by default it uses the same as twig.

路由

您讲一个单页的应用程序,所以symfony中的路由保持在一个较低的水平有几个页面刷新。相反,你必须使用你的前端框架的路由,因为我只熟悉angular.js,我举一个例子角度:

You talk of a single page application, so symfony's routing is kept on a low level to have few page refresh. Instead you have to use routing of your frontend framework, because I am only familiar with angular.js, I give an angular example:

app.config(function($routeProvider, $interpolateProvider) {

    //here you go, custom brackets
    $interpolateProvider.startSymbol('{[{');
    $interpolateProvider.endSymbol('}]}');

    $routeProvider.when('/user', {
        controller: UserController, 
        templateUrl: Routing.generate('suser_list')
    }).when('/ticket', {
        controller: TicketController, 
        templateUrl: Routing.generate('ticket_list')
    });
});

当你打像

<a href="#/ticket">Go to tickets</a>

AngularJs会知道哪个触发控制器前端。 pretty伟大的东西,无需重新加载页面。也看看<一个href=\"https://github.com/FriendsOfSymfony/FOSJsRoutingBundle\">FosJSRoutingBundle.它可以让你产生在JavaScript symfony的路线,我用它们来JS控制器,其中数据推入HTML模板链接。

AngularJs will know which frontend controller to trigger. Pretty great stuff, without page reload. Also have a look at FosJSRoutingBundle. It allows you to generate symfony routes in javascript, I use them to link js controllers with html templates where data is pushed in.

FormTypes,表单处理,验证

那么,当你使用像angularjs一个前端框架,你的symfony的表单类型是pretty没用。但我不知道。记住数据推,并通过API作为JSON拉,我认为这将是一个艰苦的工作表单类型来处理这种compexity的。

Well, when you use a frontend framework like angularjs, your symfony form types are pretty useless. But I am not sure. Remember data is pushed and pulled via api as json, I think this would be a hard job for form types to handle this kind of compexity.

有关验证,您可以使用角度的现场验证或有你的后端,没问题的symfony的验证。这可能是同时使用,客户端和服务器端验证是件好事。

For validation you can use angular's live validation or have you symfony's validation in the backend, no problem. It might be a good thing to use both, client and server side validation.

嫩枝是退出了比赛。所有数据被呈现在客户端,而不是pre上呈现服务器侧像树枝。不过,这只是如果你的应用确实是一个单页的应用程序的情况。当然,你可以用树枝,但是如果你重新加载整个页面只会刷新。

Twig is out of the race. All data is rendered on the client side, and not pre rendered on server side like with twig. But that is only the case if your application is really a single page application. Of course you can use twig, but it will only refresh if you reload the entire page.

集成学说

您仍然可以使用学说在后端。你有关于教义和SPA一个具体的问题?

You can still use doctrine in the backend. Do you have a specific question regarding doctrine and SPA?

这篇关于使用像AngularJS框架Symfony2的单页面应用程序的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆