当前位置: 首页 > 面试题库 >

典型的AngularJS工作流程和项目结构(使用Python Flask)

慕容安易
2023-03-14
问题内容

对于整个MV
*客户端框架的狂热,我还是一个新手。它不一定是AngularJS,但我选择它是因为它对我来说比淘汰赛,Ember或Backbone更自然。无论如何,工作流程是怎样的?人们是否开始使用AngularJS开发客户端应用程序,然后将其连接到后端?

还是相反,首先在Django,Flask,Rails中构建后端,然后将AngularJS应用附加到该后端?是否有“正确”的方式来做,还是最终只是个人喜好?

我也不确定是否根据Flask或AngularJS构建项目?社区实践。

例如,Flask的minitwit应用程序的结构如下:

minitwit
|-- minitwit.py
|-- static
   |-- css, js, images, etc...
`-- templates
   |-- html files and base layout

AngularJS教程应用程序的结构如下:

angular-phonecat
|-- app
    `-- css
    `-- img
    `-- js
    `-- lib
    `-- partials
    `-- index.html
|-- scripts
 `-- node.js server and test server files

我可以单独想象一个Flask应用程序,并且很容易看到像ToDo
List这样的AngularJS应用程序,但是当同时使用这两种技术时,我不知道它们是如何协同工作的。当您已经拥有AngularJS时,似乎几乎不需要服务器端Web框架,一个简单的Python
Web服务器就足够了。例如,在AngularJS待办应用程序中,他们使用MongoLab通过Restful API与数据库对话。无需在后端使用Web框架。

也许我只是感到非常困惑,而AngularJS只是一个花哨的jQuery库,所以我应该像在Flask项目中使用jQuery一样使用(假设我将AngularJS模板语法更改为与Jinja2不冲突的语法)。我希望我的问题有道理。我主要在后端工作,这个客户端框架对我来说是未知领域。


问题答案:

首先,我将以标准结构组织Flask应用程序,如下所示:

app
|-- app.py
|-- static
    |-- css
    |-- img
    |-- js
|-- templates

正如btford所提到的,如果您正在开发Angular应用程序,则需要集中精力使用Angular客户端模板,而远离服务器端模板。使用render_template(’index.html’)会使Flask将您的角度模板解释为jinja模板,因此它们将无法正确渲染。相反,您需要执行以下操作:

@app.route("/")
def index():
    return send_file('templates/index.html')

请注意,使用send_file()意味着文件将被缓存,因此,您至少在开发时可能要使用make_response():

    return make_response(open('templates/index.html').read())

然后,构建应用程序的AngularJS部分,修改应用程序结构,使其如下所示:

app
|-- app.py
|-- static
    |-- css
    |-- img
    |-- js
        |-- app.js, controllers.js, etc.
    |-- lib
        |-- angular
            |-- angular.js, etc.
    |-- partials
|-- templates
    |-- index.html

确保index.html包含AngularJS以及任何其他文件:

<script src="static/lib/angular/angular.js"></script>

此时,您尚未构建RESTful API,因此可以让js控制器返回预定义的示例数据(仅是临时设置)。准备就绪后,实现RESTful
API并使用angular-resource.js将其连接到您的angular应用程序。

编辑:我整理了一个应用程序模板,尽管比我上面描述的要复杂一些,但它说明了如何使用AngularJS +
Flask构建应用程序,并完成了AngularJS和简单的Flask
API之间的通信。如果您想签出,这里是这里:https :
//github.com/rxl/angular-flask



 类似资料:
  • 这是一个具备完整结构的标准流程工作台,如果你希望隐藏一些功能模板,可以进行如下操作,Excel服务器系统管理—〉其它设置,如图所示: E立方管理软件Excel服务器在你不需要显示的模块前面打勾选择即可,另外对于管理员来说他们总是可以看见一个完整的流程工作台。      如果你不想改变整个流程工作台的结构,而只是不想在“已处理-未完成”显示某个工作流模板的未完成工作流,那么只需要在该模板的流程图属性

  • 非常感谢您的帮助,在实施细节方面,以及我下面的两个澄清问题: 背景: 创建优惠促销工作流程。优惠有截止日期(我们在优惠被接受后开始倒计时。) 用户可以选择拒绝报价(工作流程随后停止)一旦报价被接受,他们将有7天的时间尝试兑换返现积分。一旦他们满足返现积分要求,我们将把积分记入他们的账户 第一个问题:下面的逻辑正确吗?我正在使用信号。 我是如何考虑编写工作流的(然而,当我尝试发出不同的信号时,我似乎

  • 问题内容: 即使是一个简单的Python模块,最常见的目录结构似乎也是将单元测试分成各自的目录: 例如,请参阅此Python项目howto。 我的问题是 ,实际上运行测试的通常方法 是 什么? 我怀疑这对除我以外的所有人来说都是显而易见的,但是您不能仅从test目录运行,因为模块不在路径上,它将失败。 我知道我可以修改PYTHONPATH和其他与搜索路径有关的技巧,但是我不相信这是最简单的方法-

  • 问题内容: 即使是一个简单的Python模块,最常见的目录结构似乎也是将单元测试分成各自的test目录: 例如,请参见此Python项目howto。 我的问题是,实际上运行测试的通常方法是什么?我怀疑这对除我以外的所有人来说都是显而易见的,但是你不能仅从目录运行,因为模块不在路径上,它将失败。 我知道我可以修改PYTHONPATH和其他与搜索路径有关的技巧,但我不敢相信这是最简单的方法-如果你是开

  • 问题内容: 我知道实际上没有唯一正确的方法。但是,我发现很难创建一个可以正常工作并且对每个开发人员和管理员都保持整洁的目录结构。github上的大多数项目都有一些标准结构。但是它没有显示在PC上组织另一个文件和所有项目的方法。 在开发机器上组织所有这些目录的最便捷方法是什么?你如何命名它们,以及如何连接并将其部署到服务器? 项目(你正在处理的所有项目) 源文件(应用程序本身) 存储库的工作副本(我

  • vsp_simulate 的目录结构如上图所示。 目录简介 tb/algorithm/: 用来放置对应的算法库,工程默认提供了 fft 和 logfbank 定点的实现,算法工程师即将调试和优化的算法(比如:aec、vad、doa等)放在这里。 tb/arch/xtensa/lsp-sim/: 是用来生成 lsp 的,其功能类似于 ld 链接脚本,算法开发者可以不用关心它。 tb/audio_da