AngularJS
AngularJS （也称为 Angular 1 ）是用于开发单页 Web 应用程序的框架。 PyCharm 会为预定义和自定义的 ng 指令、控制器和应用名称提供 AngularJS 感知的补全选项，并为花括号表达式 {{}} 中的数据绑定提供代码洞察。 您可以使用内置的 AngularJS 实时模板，并在 HTML 中的控制器名称与 JavaScript 中的定义之间导航，或在 ngView 或 &routeProvider 与模板之间导航。 对于 AngularJS 实体，请使用 转到符号 导航。
在开始之前
请确保您的计算机上已安装 Node.js。
请确保在设置中启用了 JavaScript and TypeScript 插件。 按 Ctrl+Alt+S 打开设置，然后选择 。 点击 已安装 选项卡。 在搜索字段中，键入 JavaScript 和 TypeScript。 有关插件的更多信息，请参见 管理插件。
在 设置 | 插件 页面，选项卡 Marketplace 上安装并启用 Angular 和 AngularJS 插件，如 从 JetBrains Marketplace 安装插件 中所述。 该插件仅在 PyCharm 专业版中提供。
创建新的 AngularJS 应用
您可以在项目中安装 AngularJS，方式包括手动下载 AngularJS 框架，或使用 Bower 包管理器。
下载 AngularJS 依赖项
在内置的 终端 （Alt+F12 ）中，键入：
npm install或者，在您的项目根目录中的 package.json 文件的上下文菜单中选择 运行 'npm install'。
创建空白 PyCharm 项目
在 欢迎屏幕 屏幕上点击 创建新项目 ，或从主菜单中选择 。 新建 项目 对话框 打开。
在左侧窗格，选择 空项目。
指定用于存储与项目相关文件的文件夹路径。
单击 创建。
在空的项目中手动安装并配置 AngularJS
从 http://angularjs.org/ 下载 AngularJS 框架。
打开将使用 AngularJS 的 Pure Python 项目。
将 AngularJS 配置为 一个 PyCharm JavaScript 库，以便 PyCharm 识别 AngularJS 特定结构并提供完整的编码辅助：
在 设置 对话框（Ctrl+Alt+S ），转到 。
在 库 区域，点击 添加 按钮。
在打开的 新建库 对话框中，指定库的名称。
在库文件列表旁，点击 添加 按钮（
），然后根据您需要单独文件还是整个文件夹，选择 附加文件… 或 附加目录…。在打开的对话框中，选择 Angular.js ，或 Angular.min.js ，或整个目录。
PyCharm 返回到 新建库 对话框，其中 名称 只读字段显示所选文件或文件夹的名称。
在 按类型分组 字段中，指定您已下载并将要添加的版本。
如果您添加了 Angular.js ，请选择 调试。 此版本在开发环境中非常有用，尤其适用于调试。
如果您添加了 压缩版 Angular.min.js ，请选择 发布。 此版本在生产环境中非常有用，因为文件大小显著更小。
在 配置 JavaScript 库 了解更多信息。
使用 Bower 在空的项目中安装 AngularJS
从现有的 AngularJS 应用开始
如果您已经在项目中拥有 Angular 源（例如在 bower_components 文件夹中），就打开您的项目并开始工作。 如果这些源已被 从项目中排除 ，则您只需将 AngularJS 配置为 JavaScript 库。
从您的版本控制系统中检出应用源代码
在 欢迎屏幕 屏幕左侧窗格中点击 克隆。
或者，从主菜单中选择 或 或 。
在主菜单中，您可能会看到与项目关联的其他任何版本控制系统，而不是 Git。 例如， Mercurial 或 Perforce。
在打开的对话框中，从列表中选择您的版本控制系统，并指定要从中检出的应用源代码的存储库。 欲了解详细信息，请参阅 检出项目（克隆）。
下载依赖项
在弹出窗口中点击 运行'npm install'：
项目安全
当您打开在 PyCharm 之外创建并导入到其中的项目时，PyCharm 会显示一个对话框，您可以在其中决定如何处理包含不熟悉源代码的该项目。
选择以下选项之一：
在安全模式中预览 ：在这种情况下， PyCharm 以预览模式打开项目。 这意味着您可以浏览项目的源代码，但无法运行任务和脚本，也不能运行/调试您的项目。
PyCharm 会在编辑器区域顶部显示通知，您可以随时点击 信任项目… 链接加载项目。
信任项目 ：在这种情况下， PyCharm 打开并加载项目。 这意味着项目已初始化、项目插件已解析、已添加依赖项，并且所有 PyCharm 功能均可用。
不打开 ：在这种情况下， PyCharm 不打开项目。
在 项目安全 了解更多信息。
使用 AngularJS Router 状态图
在 AngularJS 应用中使用 ui-router 的情况下，您可以查看说明视图、状态和模板之间关系的图。
生成并查看图
在编辑器中打开所需的文件，然后从上下文菜单中选择 。 PyCharm 会生成一个图，并在单独的编辑器选项卡中显示。
从图中的元素导航到实现该元素的代码
选择该元素，然后从上下文菜单中选择 跳转到源代码。