你的位置:首页 > 软件开发 > Java > AngularJS 学习笔记(1)

AngularJS 学习笔记(1)

发布时间:2015-08-09 23:00:27
AngularJS是一款前端JS框架。AngularJS官网 http://angularjs.org【开发环境准备】:1,下载AngularJS:JS and CSS in Solution2,编辑器 WebStorm,下载地址:https://www.jetbrain ...

 AngularJS是一款前端JS框架。AngularJS官网 http://angularjs.org

【开发环境准备】:

1,下载AngularJS:JS and CSS in Solution

2,编辑器 WebStorm,下载地址:https://www.jetbrains.com/webstorm/  (配合最新版JetBrains使用,可以即时无刷新显示更新代码后的效果)

3,下载最新版Chrome,并安装扩展程序:JetBrains IDE Suport,(需要FQ)

下载地址:https://chrome.google.com/webstore/detail/hmhgeddbohgjknpmjagkdomcpobmllji

安装完毕以后Debug看一下效果:webstorm中保存代码,chrome立即显示更新代码后的效果

AngularJS 学习笔记(1)

01-Binding: ng-model存储绑定数据,{{}}直接读取存储绑定的数据  如下:

  {{}}绑定不仅可以直接绑定在HTML标签内容中,而且还可以 绑定在Class属性的值中

AngularJS 学习笔记(1)AngularJS 学习笔记(1)
<!DOCTYPE html><html "http://www.w3.org/1999/xhtml"><head>  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  <title>1.1 HelloWorld</title>  <link rel="stylesheet" href="css/foundation.min.css">  <script src='/images/loading.gif' data-original="script/angular.js"></script></head><body ng-app>  {{1+6}}<br/>  {{2*4}}<br/>  {{'hello world'}}  {{'橙子'+' 你好'}}<br/>  <input type="text" ng-model="data.message"/>  <h1>{{data.message}}</h1>  <div class="{{data.message}}">  wrap me with a foundation component  </div></body></html>

原标题:AngularJS 学习笔记(1)

关键词:JS

JS
*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们: admin#shaoqun.com (#换成@)。