AngularJS SPA架构

Question

我正在制作SPA，而且我正在努力使用正确的架构来实现它。所以我将在这里概述细节，然后是结构和问题。如果有人能告诉我布局过程的正确方法，那将非常有用。

SPA详情： 一种会计程序，访问者无需身份验证即可完全访问该站点，并可用于更改各种数据。除非他们注册帐户，否则不会保存。用户无法从其他用户的帐户中看到任何信息。

SPA结构： 在注册或身份验证之前：

• 一些JS对象存储在服务中（StartService）：accData，accCompanies {}这些包含所有要操作的数据
• 另一项服务（FunctionsService）依赖于StartService并保留所有功能，因为它们用于多个控制器
• 函数服务被注入控制器，并为服务中的每个函数创建$ scope变量。

注册时：

• 存储在StartService中的对象将作为新帐户数据发送到服务器。

登录时：

• 从服务器检索用户帐户中的对象并将其放入StartService。

然后，用户可以单击一个保存按钮，将StartService数据发送到他们的帐户（与注册时的过程相同）

问题和疑问：

• 我无法弄清楚如何让双向数据绑定在两个服务，控制器和视图之间起作用。
• 我需要更改结构吗？例如，一个服务而不是2个，json文件中的数据而不是服务中的数据，只使用一个控制器并将函数移动到该控制器？

Answer 1

我会推荐一个框架，就像angularjs2一样，它为你的SPA项目提供了结构。你做依赖注入并使用类型安全的类型脚本。以下是关于如何处理RESTful通信的教程：

https://angular.io/docs/ts/latest/guide/server-communication.html

处理SPA内的路由看看这个答案：

angularjs2 SPA - how to change gulp task to prevent cannot get /page error

我个人更喜欢在window.fetch上使用http.post（来自angular2 / http），因为我发现更容易处理cors问题。

就数据传输而言，我建议您将注册数据发送到后端（通过json POST），后端发送一个jwt（json令牌），用于验证每个后续请求。

我还建议使用GET（返回json）来获取在每个页面上显示用户特定信息所需的所有信息。

如果您需要更多详细信息，请与我们联系。