angularjs 概念概述
引入angularjs 庫
src=
"">
script
>
>
在html的input中新增ng-model
實現雙向繫結
>
>
src=
"">
script
>
head
>
>
>
>
name:label
>
type
="text"
ng-model
="yourname"
placeholder
="enter a name here"
>
>
>
hello }!h1
>
ng-bind
="yourname"
>
h1>
div>
body
>
html
>
ng-model 指令把元素值(比如輸入域的值)繫結到應用程式。ng-bind 指令把應用程式資料繫結到 html 檢視。
ng-init
定義變數,ng-bind / }
顯示變數
ng-init
="firstname='john'
">
>
姓名為 ng-bind
="firstname"
>
span
>
p>
}div
>
ng-model
實現雙向繫結,即改變變數的值,會立刻在頁面中渲染出來
ng-repeat
迴圈遍歷陣列
ng-controller
定義控制器,as
定義控制器的別名
ng-click
用來定義事件,後面的方法要有 「()」
}
可以顯示變數,裡面可以是js 表示式
="invoice1"
>
>
src=
"../public/js/angular.min.js"
>
script
>
head
>
>
ng-controller
="invoicecontroller as invoice"
>
>
訂單:b
>
>
數量: type
="number"
ng-model
="invoice.qty"
required
>
} div
>
>
單價: type
="number"
ng-model
="invoice.cost"
required
>
} ng-model
="invoice.incurr"
>
ng-repeat
="c in invoice.currencies"
>
}option
>
select
>
div>
>
>
總價:b
>
>
ng-repeat
="c in invoice.currencies"
>
} ---- }
li>
ul>
class
="btn"
ng-click
="invoice.pay()"
>
支付button
>
div>
div>
body
>
html
>
>
angular.
module
('invoice1',[
]).controller
('invoicecontroller',[
'$scope'
,function
($scope)
;this
.total
=function
total
(outcurr)
;this
.convertcurrency
=function
convertcurrency
(amount, incurr, outcurr)
;this
.pay
=function
pay();
}]);
script
>
ExtJS入門 環境搭建
extjs是一種主要用於建立前端使用者介面,是乙個基本與後台技術無關的前端ajax框架。一 引入類庫檔案 extjs類庫介紹 adapter 負責將裡面提供第三方底層庫 包括ext 自帶的底層庫 對映為ext 所支援的底層庫。build 壓縮後的ext 全部原始碼 裡面分類存放 docs api 幫...
vue入門環境搭建
最近,vue.js越來越火。在這樣的大浪潮下,我也開始進入vue的學習行列中,在網上也搜了很多教程,按著教程來做,也總會出現這樣那樣的問題 坑啊,由於網上那些教程都是vue.js 1.x版本的,現在用vue.js 的構建工具都已經公升級到2.0版本了 經過了一段時間的摸索和看官方的教程和api,才了...
Pig入門 環境搭建
pig入門 環境搭建 本文介紹在linux redhat hadoop2.2.0 jdk1.7的環境下安裝pig 0.14.0.二 安裝及配置 1 解壓至安裝目錄 比如 tar zxvf pig 0.14.0.tar.gz c itcast 2 配置 編輯 bash profile檔案 新增 exp...