为什么 webstorm 插件8 装 AngularJS 插件不成功

来源：蜘蛛抓取(WebSpider) 时间：2014-12-02 02:29 标签： angularjs api
& AngularJS最理想开发工具WebStorm
AngularJS最理想开发工具WebStorm
，将介绍如何用angularjs构建一个强大的web前端系统。angularjs是由Google团队开发的一款非常优秀web前端框架。在当前如此多的web框架下，angularjs能脱颖而出，从架构设计上就高人一等，双向数据绑定，依赖注入，指令，MVC，模板。Angular.js创新地把后台技术融入前端开发，扫去jQuery一度的光芒。用angularjs就像写后台代码，更规范，更结构化，更可控。
张丹(Conan), 程序员Java,R,PHP,Javascript
weibo：@Conan_Z
转载请注明出处：
俗语讲：“工欲善其事，必先利其器”，为了玩转AngularJS，顺手的工具要选好。在上一篇文章中，通过，通过vi编辑器和命令行操作，我们几乎可以完成整个的项目开发。但是，随着代码量和文件数的增加，文件和目录越来越难把握，代码文件各种难懂，缩进不一致，controller和directive被多少个地方所引用，。。。
我们需要一个IDE，来帮助我们更好的看懂项目，管理代码。WebStorm是目前我认为AngularJS开发最理想工具。
WebStorm介绍
导入Javascript工程
安装AngularJS插件
WebStorm使用
1. WebStorm介绍
WebStorm 是jetbrains公司旗下一款JavaScript 开发工具。被广大中国JS开发者誉为“Web前端开发神器”、“最强大的HTML5编辑器”、“最智能的JavaSscript IDE”等。与IntelliJ IDEA同源，继承了IntelliJ IDEA强大的JS部分的功能。
下载：/webstorm/index.html
WebStorm可能最大的缺点就是需要付费，对于个人开发者49刀。不过，WebStorm还推出了几种免费的liences。
Classroom License:申请课堂演示
Open Source Project License:申请做为开源项目的贡献者
MVP License: 申请微软的专家
可以通过购买页面找到信息：/webstorm/buy/index.jsp
当然我是不会告诉大家，在google里可以找到过去版本的liences的，只是中国的程序员真是太苦逼了。
2. 导入Javascript工程
打开WebStorm后，我们可以通过操作：
"file"==&"open Directory..."==&"select Directory" ==& "ok"
来选择我们已经构建好的工程。
WebStrom对Html5, javascript, css，json… 大部分的代码都支持非常好。
3. 安装AngularJS插件
不过，默认的WebStrom并不认识，AngularJS的指令，当我尝试写代码ng-controller时，编辑器没有出现对应该的提示。
对于特别熟悉的AngularJS的人来说，并不是那么重要。但是，如果有语法提示不是会更好吗？
安装AngularJS插件，两种办法：
在IDE中，自动下载自动安装
手动下载，手动安装
1). 在IDE中，自动下载自动安装
我们需要以下的操作：
1. File-&Settings-&Plugins
2. 点击 “Browse Repositories”
3. 选中 “AngularJS” 双击
4. 选择 “Yes”
5. 重启WebStorm
我在使用这个方法的时候失败了
2). 手动下载，手动安装
我们在jetbrains的插入库中，找到AngularJS：/plugin/6971
下载angularjs-plugin.zip，然后解压到D:\toolkit\WebStorm 6.0.1\plugins\目录
~ D:\toolkit\WebStorm 6.0.1\plugins\angularjs-plugin
重启WebStorm
再次输入代码：
语法的提示，太帅气了！！
我查了一下插件的开发者的代码，支持全部的angularJS指令语法：
ng-app,ng-bind,ng-bind-html-unsafe,ng-bind-template,ng-class,ng-class-even,ng-class-odd,
ng-cloak,ng-controller,ng-form,ng-hide,ng-include,ng-init,ng-non-bindable,ng-pluralize,
ng-repeat,ng-show,ng-submit,ng-style,ng-switch,ng-switch-when,ng-switch-default,ng-options,
ng-view,ng-transclude,ng-model,ng-list,ng-change,ng-value,ng-required,required
4. WebStorm使用
1). 对于HTML的页面：WebStorm会在右上角出现浏览器的图标方便我们打开测试
2). 对Javascript脚本：WebStorm会方便的配置NodeJS启动, UnitTest启动 等等
IDE的功能很强大，熟悉后会极大地提升我们的开发效率的，特别是对于大规模的多人项目。
转载请注明出处：
This entry was posted in
Pingback: ()
Pingback: ()
Designed by收藏，1.1k 浏览
问题对人有帮助，内容完整，我也想知道答案
问题没有实际价值，缺少关键内容，没有改进余地
版本是最新的8.03，按理说应该直接可以识别angularJS语法的。
查看setting-plugins也能看到angularJS确实已经默认安装了，也尝试过重新手动安装，但依然没有效果。
问题可能会是出在哪里呢？谢谢。
答案对人有帮助，有参考价值
答案没帮助，是错误的答案，答非所问
6月17日 回答
download library
同步到新浪微博
举报理由：
带有人身攻击、辱骂、仇恨等违反条款的内容
与已有问题重复
内容质量差，或不适合在本网站出现
答非所问，不符合答题要求
其他原因（请补充说明）
补充说明：帮助企业打造成功软件！
热门搜索：
Web神器WebStorm 8.0测试版发放（慧都独家）
Web神器WebStorm 8.0测试版发放（慧都独家）
| 作者： |
09:52:13| 阅读 0次
概述：WebStorm 8.0测试版发放,提供Windows版本安装包。
WebStorm&8.0测试版的发放，标志着WebStorm规划构建的发展成熟。
此次WebStorm&8.0测试版的主要变化是支持高级的AngularJS和集成Spy-js&JavaScript跟踪工具。继续朝着成为最聪明的JavaScript&IDE&方向前进，被广大开发者誉为&Web神器&也是名至实归的。
支持高级的AngularJS包括：
完成的指令(包括内置和自定义)&
快速查找文档内置标签
完成ng-app和ng-controller属性
支持AngularJS实体
Spy-js&是一个JavaScript&WebStorm跟踪工具,用于跟踪、调试和分析代码。集成以后支持操作：
创建新的spy-js&RC
指定节点路径和跟踪你想使用服务器端口
跟踪指定的URL
配置http代理，设置使用localhost:3546(端口你RC中指定)
通过浏览器打开/刷新跟踪
慧都提供，随后将继续发放WebStorm&8.0测试版的Mac与Linux版本。测试版不需要许可，可试用30天，欢迎大家试用。
本站文章除注明转载外，均为本站原创或翻译
欢迎任何形式的转载，但请务必注明出处，尊重他人劳动成果
转载请注明：文章转载自：慧都控件网 []
本文地址：angularjs的一个问题，ng-repeat中使用ng-click - V2EX
V2EX = way to explore
V2EX 是一个关于分享和探索的地方
已注册用户请 &
- a JavaScript code quality tool
angularjs的一个问题，ng-repeat中使用ng-click
· 341 天前 · 2091 次点击
最近在学angular 遇到一个问题
模板是这样settings是这样结构类似于选项卡可是我这么写没效果
点ng-click修改不了ng-include可是在另一个页面里这么写是有效果的额搞不懂。。
6 回复 &| &直到
02:07:58 +08:00
& &340 天前
ng-click=&L = set.link&
& &340 天前
ng-click 里面不用加双括号
& &340 天前
@ @ 不加双引号的话加载出来就还是ng-click=& L = set.link &加双引号加载出来是ng-click=“ L = '模板路径' ”所以我就搞不明白是哪儿的问题了
& &340 天前
@ 1楼给的文档里面的例子很明白了，ng-click 是不用加花括号的还有就是你的代码的 scope 的问题，因为 ng-repeat 里面输出的元素会有自己新的 scope, L 所在的 scope 是 rootScope，所以就导致变成下面的状况你每次 ng-click 的时候其实是在新的 scope 里面在创建一个自己的 L 然后赋值的，而 rootScope 的值是一直没变的，比如随便点击了一个就是下面的状况：解决办法就是，把你代码里面的 L 变成 L.link 或者其他 L.anything. 起的作用你可以去 egghead.io 里面看看，专门有讲解的，加了之后 scope 层级就变成这样了：最后推荐一下我用的这个 chrome 插件，AngularJS Batarang，学 AngularJS 必备～
& &340 天前
@ 图不小心删了这是用 L 时候的 scope:加了 . 之后的 scope:
& &340 天前
@ 非常感谢
& · & 807 人在线 & 最高记录 1065 & · &
创意工作者们的社区
Lovingly made by OLIVIDA
VERSION: 3.5.6.1 · 28ms · UTC 14:05 · PVG 22:05 · LAX 06:05 · JFK 09:05? Do have faith in what you're doing.

我要回帖

更多关于 angularjs api 的文章

 

随机推荐