zoukankan      html  css  js  c++  java
  • Angular JS--Angular的引入和初始化

    1.Angular JS简介

      Angular JS是Google开发的一个前端JS框架。最为核心的是:MVVM、模块化、自动化双向数据绑定、语义化标签、依赖注入。

      文档网站:http://www.angularjs.net.cn/

      视频学习地址:http://www.imooc.com/learn/156

    2.Angular JS下载

      官方网站:https://code.angularjs.org/

      选择最新的版本,然后下载

      

    3.页面中如何使用Angular JS

      在HTML页面底部通过<script>标签进行引入。放置在页面底部的好处是:避免HTML加载时被Angular JS滞带

    <!doctype html>
    <html xmlns:ng="http://angularjs.org" ng-app>
      <body>
        ...
        <script src="angular.js">
      </body>
    </html>

      如果要在项目中自动启动Angular,那就把ng-app放入根节点中,通常是<html>标签<html ng-app>

      如果项目要在IE7上运行,就加上id="ng-app"像这样<html ng-app id="ng-app">

    4.自动初始化

      1.在DOMContentLoaded事件触发

      2.在angular.js脚本被执行的同时将document.readyState设置为"complete"

      过程:初始化时,Angular会去找ng-app这个指明应用开始所在的指令,如果ng-app被找到,Angular就会加载ng-app指令所指定的模块,然后根据ng-app所在的根节点遍历和编译DOM树,然后创建所需要的injector

    5.手动初始化

    <!doctype html>
    <html xmlns:ng="http://angularjs.org">
      <body>
        Hello World!
        <script src="http://code.angularjs.org/angular.js"></script>
        <script>
           angular.element(document).ready(function() {
             angular.module('myApp', []);
             angular.bootstrap(document, ['myApp']);
           });
        </script>
      </body>
    </html>

       

  • 相关阅读:
    Python_装饰器复习_30
    Python_每日习题_0002_个税计算
    linux-文件流4种读取方式
    Max Sum Plus Plus
    棋盘问题
    noip数学
    P3384 【模板】树链剖分
    P2419 [USACO08JAN]牛大赛Cow Contest
    poj3159 Candies(差分约束)
    小K的农场(差分约束)
  • 原文地址:https://www.cnblogs.com/-scl/p/7687278.html
Copyright © 2011-2022 走看看