PhpStorm 对 AngularJS 的支持

 

异常疼爱用AngularJS来构建web应用程序的前端吗? PhpStorm 使得以该及展开
AngularJS 相关的工作以及其他得IDE支持的编程语言的做事同样好!

AD:51CTO首至中国APP创新评选大赛在招募>>

 

可怜热衷用AngularJS来构建web应用程序的前端吗? PhpStorm 使得以该及进展
AngularJS 相关的做事和其他得IDE支持的编程语言的办事同容易!
为了好自行就,快速文档,导航并支持从定义指令与路由,我们唯一要开的便是当PhpStorm中安装AngularJS插件.
何乐而休为呢?

PhpStorm中添加AngularJS插件

勿是富有的PhpStorm特性都是默认开启的,而AngularJS就是里有!
我们好由此挑选 IDE Settings | Plugins , 并点击 Install
JetBrains
Plugin…
 按钮而以AngularJS安装到我们的IDE中,来被用于PhpStorm的AngularJS插件.
稍后快速又开一下,我们理应就是发出一个对AngularJS的圆满支持可采用了!

AngularJS 自动补全支持

少数人说, “字典中之各一个歌词都发出一个Javascript框架和那个针对性应.”
而立便是PhpStorm默认不为这么多之Javascript框架展示自行补全职能的原因,
因为我们并无思吓到您!
为了开启AngularJS的自发性补全,我们好开如下两桩业务的内之一:

  • 从 她的网站 下载AngularJS的脚本并拿 angular.js
    文件上加到我们的色中
    .

  • 使某一个表面的 CDN 并像咱的动添加正确的下本标记. (提示:
    按下 *Alt+Enter 下载库*. PhpStorm
    将会吧AngularJS方法、指令、文档等等下载并设置一个缓存来提供自动补全.这无异于也可经  Project
    Settings | JavaScript | Libraries 来做到
    , 使用 Download
    library…
     按钮来打TypeScript社区文化馆下载 angularjs.

 

倘完成了这些操作, PhpStorm 可以起来吧HTML属性提供自动补全(例如.ng-app)
,以及对Javascript的机关补全. 有各种快捷缩写可以使用:
输入na将见面适配出 ng-app, nc 将会晤是配出 ng-class 等等.
适当的上我们的控制器和打定义指定将会见于建议列表中列出来.
匹配的括号也会见活动就: 输入 {{ 同样也会见自行插入 }}.

图片 1

俺们为得以下 ***Ctrl+Q (Mac
OS X上是
F1 )* 来快速查看我们的Angular指令的文档.
我们呢可快点击浏览在线文档.

图片 2 

导航与检查  

就此平等的道我们可以一个 PHP 和一个 JavaScript 代码库中开展导航,
我们本足导航并浏览整个AngularJS应用程序.
在模块,控制器和下令中开展导航可以用 Ctrl+click** (在Mac OS
X上使用 *
Cmd+Click、)
,它以会见及时将咱带来至我们模块,控制器和下令给定义之地方.
我们得采取
Ctrl+Alt+左箭头 导航返回我们原先所于的地方(在Mac
OS X上使用
Cmd+Alt+*左箭头**).

图片 3

导航同样可当变量和过滤器上面下. PhpStorm
也会见在它不克找到给定的模块,控制器或者过滤器时提醒我们:

图片 4 

自从定义指令与重构的支撑  

PhpStorm 同样支持针对咱团结一心之一声令下的自发性补全和导航.
我们竟然可以告诉PhpStorm在调用自动补全时应当利用啊一样码:
如果我们用限制: ‘E’ 用于打定义元素, IDE 将会晤将活动补全范围到正素.
如果我们采取范围: ‘A’, 那么她只是见面针对性能从作用.

图片 5

俺们为足以为自定义指令里之表达式添加自动补全的支持.
我们而开的绝无仅有的作业虽是用 @ngdoc, @name, 和 @param添加合适的文档. IDE
将会见变换文档来理解哪一个性接收表达式.

一经我们使用Rename重构对咱的自定进行了重命名 (Mac OS
X上是Shift+F6 或者 Ctrl+T), PhpStorm
将会针对HTML和Javascript(还有评价,文档,…)都开展创新,以便我们的命名总是保持同步.

图片 6 

路由和URL模板的支持  

PhpStorm 也会见由此提供自动补全和导航来当路途由于与URL模板上吧我们提供帮助.
这里仿佛之,我们得大概的以我们的鼠标指针放到引号之间并依下Ctrl+Space来使用基于当前路的自发性补全.
如果我们仍下 Ctrl+Space 两浅, 将会见促成整项目给显示出来.

图片 7

央留心当创建多单模块是,我们要用有些的父目录标记为一个资源根,以便自动补全和导航能健康工作.

重构在此吧同样可于作用:
如果我们当其余文件要URL模板上用Rename进行重构, PhpStorm
将见面更新我们所有项目蒙有的引用.

对在PhpStorm中使用AngularJS感兴趣? 那就算下载最新的 PhpStorm 8
EAP,
安装 AngularJS插件跑起 !  欢迎你在 issue
tracker 上提出申报,
或者以我们的 论坛 回复评论!

乐开发!

– JetBrains PhpStorm 小组

英文原稿:AngularJS support in
PhpStorm

译文链接:http://www.oschina.net/translate/angularjs-support-in-phpstorm

【编辑推荐】

  1. 如何以 AngularJS
    中针对控制器进行单元测试
  2. AngularJS数据建模
  3. 借助AngularJS写优雅的代码
  4. AngularJS
    指令(Directives)实践指南
  5. 整合jQuery Mobile+AngularJs
    经验谈

相关文章