1. 程式人生 > >Angular入門知識點總結

Angular入門知識點總結

知識點總結

1.Angular入門

    (1) ng-app是AngularJS應用程式執行的入口( ng-app="myApp")

    (2)當AngularJS程式要執行時,找到了ng-app開始執行
    (3)執行開始,載入主要模組:myApp模組(var app = angular.module("myApp", []);)

    (4)將一個標籤和控制器進行繫結,控制器中的資料,就可以使用在這個標籤的內部了

    標註:ng-model用來將表單元素的資料和變數雙向繫結

                雙大括號中,可以直接寫變數名稱,和變數的資料繫結,變數的資料發生改變,頁面的資料會同時改變

<!DOCTYPE html>
<!--
    入門程式第一彈:
    |-- ng-app="myApp"   程式執行入口,載入myApp模組
        |-- angular.module("myApp", []);
            |-- angular.controller("myCtrl", function(){});
                |-- function($scope) {}
                    |-- $scope.hello = "值";


    <html ng-app="myApp">
        ....
        <div ng-controller="myCtrl">
            ....
            {{hello}}
-->
<!--
    ng-app是AngularJS應用程式執行的入口
        當AngularJS程式要執行時,找到了ng-app開始執行
            執行開始,載入主要模組:myApp模組
-->
<html ng-app="myApp">
<head>
    <meta charset="UTF-8">
    <title>AngularJS Hello World!</title>
    <script src="js/lib/AngularJS/angular.min.js"></script>
</head>
<body>
    <!-- 將一個標籤和控制器進行繫結,控制器中的資料,就可以使用在這個標籤的內部了-->
    <div ng-controller="myCtrl">
        <!-- ng-model用來將表單元素的資料和變數雙向繫結 -->
        <input type="text" ng-model="hello"><br />
        <input type="text" ng-model="hello"><br />
        <input type="text" ng-model="hello"><br />
        <input type="text" ng-model="hello"><br />
        <input type="text" ng-model="greeting"><br />
        <input type="text" ng-model="greeting"><br />
        <input type="text" ng-model="greeting"><br />
        <!-- 雙大括號中,可以直接寫變數名稱,和變數的資料繫結,變數的資料發生改變,頁面的資料會同時改變 -->
        {{hello}}<br />
        {{greeting}}
    </div>
<script>
    /*定義一個Angular模組*/
    var app = angular.module("myApp", []);


    app.controller("myCtrl", function($scope){
        $scope.hello = "hello angularjs!今天開始,要進行JS高階開發部分"
        $scope.greeting = "hello angularjs!今天開始,要進行JS高階開發部分"
    });
</script>
</body>
</html>

相關推薦

Angular入門知識點總結

知識點總結 1.Angular入門     (1) ng-app是AngularJS應用程式執行的入口( ng-app="myApp")     (2)當AngularJS程式要執行時,找到了ng-app開始執行     (3)執行開始,載入主要模組:myApp模組(var

前端筆記----jquery入門知識點總結 (轉)

outer 尺寸 對象 層級 ani 入門 fontsize fun click http://www.cnblogs.com/cwp-bg/p/7633623.html 一、jquery的加載方法 $(document).ready(function(){js代碼});

Python入門知識點總結

1:環境變數,在系統變數path中新增Python安裝路徑,添一個就ok了 2.註釋單行,用#號     多行註釋用成對兒的單引號或雙引號來完成 轉譯字元號:\ 3.一種解釋型弱型別的語言 弱型別:定義變數時不需要

Python資料分析入門知識點總結

入門Python資料分析的知識點總結,也可做速查表。只需要學會下面的知識點就可以在工作中勝任大部分的工作需求。 Python 版本:3.2.3 Python工具:jupyter notebook

MDN——javascript——入門——第三章對象——json——知識點總結

.json 控制 als null 集合 ron for com 音頻 1. JSON:javascript object notation(js 對象表示法) 將結構化數據表示為JavaScript對象的標準格式, 通常用於在網站上表示和傳輸數據 (從服務器向客戶端

MDN——javascript——入門——第一章——知識點總結

函數 onclick cas miss lower creat fun 連接 ora 1.什麽是js: JavaScript 是允許你在網頁中實現復雜事情的一門編程語言 例子: var para = document.querySelector(‘p‘);

C#入門基礎語法知識點總結(變量、運算符、類型轉換)

add rem 靜態變量 問題: orm 年齡 指定 com oval 一、C#中的變量 變量的命名: 1、變量名的組成要求 組成:英文字母(A~Z,a~z)、數字(0~9)、下劃線(_),除此之外不能包含有其他字符 開頭:只能以字母或下劃線開頭 禁用:C#關鍵字(int、

python中列表的知識點總結,出自python程式設計從入門到實踐!

  訪問列表元素 列表是有序集合,因此要訪問列表的任何元素,只需將該元素的位置或索引告訴 Python 即可。要訪問列表元素,可指出列表的名稱,再指出元素的索引,並將其放在方括號內。             &n

校招知識點總結篇之產品經理(菜鳥入門

一、簡短清晰的自我介紹 二、APP功能的對比分析 1.分析一款你最喜歡的app,它的產品定位、目標使用者、競爭優勢,有哪些可以改進的地方?(最常用的app功能與同類APP的優劣勢比較分析及改進點,如淘寶、京東) 淘寶功能的改進:淘寶功能的瘦身和優化;地址暴漏問題(地址的

完美Python入門基礎知識點總結

Python識別符號 在 Python 裡,識別符號有字母、數字、下劃線組成。 在 Python 中,所有識別符號可以包括英文、數字以及下劃線(_),但不能以數字開頭。 Python 中的識別符號是區分大小寫的。 以下劃線開頭的識別符號是有特殊意義的。以單下劃

PHPExcel所遇到問題的知識點總結

tor 沒有 share [] 計算 針對 dex data 行數 工作中進行excel的時候遇到了兩個問題, 1.excel表中列值過大,由於沒有進行特殊處理,程序沒法正常運行; 2.列值中含有日期格式的文本,不能正確讀取; 所以通過網絡搜索,並解決了問題,記錄一下,以備

PHP面向對象知識點總結

ace extend face 技術 space this 實例 mes 代碼 1、$this是什麽 當前類實例化的對象 2、訪問對象中的成員 對象->成員 3、構造方法 通常用來初始化對象的屬性,不用把屬性寫死,不同的對象就有了不同的屬性 4、get、s

交叉編譯知識點總結

搜索 參考 install pri 庫文件 sta rar nsis blog 參考鏈接: http://www.cppblog.com/runsisi/archive/2012/10/08/193027.html gcc 搜索路徑: 1、 gcc -print-

js事件相關知識點總結

模型 em1 detach 事件偵聽 包含 ring 分享 target 上傳 HTML頁面是怎樣實現交互的? 2017-05-22 js事件之事件流: 事件流原理圖:事件流是從window開始,最後回到window的一個過程,分為三個階段(1~5)捕獲過程、(5~6)

css中小知識點總結

就會 input 如果 con 標註 標記 獲得 出現 continue rgba:即rgb+a, a為圖片透明度,a範圍是0~1,越小就表示越透明 :hover 即鼠標懸停時改變樣式,不僅僅能用在a元素上。 <form>標簽表示向瀏覽器提交表單,一般會包裹著

[rctf](web)rcdn 解題分析,知識點總結

數據庫 方法 code dom arc 比賽 start 關閉 學習 比賽平臺關閉了,沒有截圖,見諒。 解題思路流程: 分析網站結構,看源碼,元素審計。發現以下信息。 要得到flag要獲得一個pro cdn pro 子域名長度為3到6個字符 存在一個提交ticke頁面

javascript知識點總結

ava javascrip ons all 一點 http 實例 www 恢復 ---恢復內容開始--- js中的六種繼承方式: http://www.cnblogs.com/ayqy/p/4471638.html 這篇博客總結的比較清楚了。要註意一點,來自原型對象的引用

JavaScript知識點總結之如何提高性能

前端開發 原型 操作 tag head 取數 理解 定義變量 創建 先給大家鞏固下javascript基本語法: javascript基本語法 定義變量統一用var關鍵字 語法:var 變量名稱=變量值 標示符:①、由字母數字下劃線構成 不能以數字開頭 不能是關鍵字 嚴格區

react native 知識點總結(一)

修改 ltp 組件 改變 set 覆蓋 sta 一個 個數 一、關於react native 版本的升級 參照文檔:http://reactnative.cn/docs/0.45/upgrading.html react-native -v

React Native細節知識點總結<一>

idm tdi 刷新 循環 chan filelist sse inpu function 1.propTypes: static propTypes = { name:PropTypes.string, ID:PropTypes.num