<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <script src="http://apps.bdimg.com/libs/angular.js/1.2.16/angular.min.js"></script>
</head>
<body ng-app="myApp">
  <div ng-controller="myCtrl">
    {{ hello }}
  </div>
  <script type="text/javascript">
    var myModule = angular.module("myApp",[]);
    myModule.controller("myCtrl",function($scope){
      $scope.hello = "hello,angular!";
    });
  </script>
</body>
</html>

運(yùn)行后，會(huì)顯示hello,angular!

手動(dòng)初始化

Angular中也提供了手動(dòng)綁定的api——bootstrap，它的使用方式如下：

angular.bootstrap(element, [modules], [config]);

其中第一個(gè)參數(shù)element:是綁定ng-app的dom元素；

modules：綁定的模塊名字
config：附加的配置

簡(jiǎn)單的看一下代碼：

<html>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <script src="http://apps.bdimg.com/libs/angular.js/1.2.16/angular.min.js"></script>
<body id="body">
  <div ng-controller="myCtrl">
    {{ hello }}
  </div>
  <script type="text/javascript">
    var app = angular.module("bootstrapTest",[]);
    app.controller("myCtrl",function($scope){
      $scope.hello = "hello,angular from bootstrap";
    });
    
    // angular.bootstrap(document.getElementById("body"),['bootstrapTest']);
    angular.bootstrap(document,['bootstrapTest']);
  </script>
</body>
</html>

值得注意的是：

angular.bootstrap只會(huì)綁定第一次加載的對(duì)象。

后面重復(fù)的綁定或者其他對(duì)象的綁定，都會(huì)在控制臺(tái)輸出錯(cuò)誤提示。

以上就是對(duì)AngularJS bootstrap 的資料整理，后續(xù)繼續(xù)補(bǔ)充相關(guān)資料，謝謝大家對(duì)本站的支持！

您可能感興趣的文章:

angular使用bootstrap方法手動(dòng)啟動(dòng)的實(shí)例代碼

相關(guān)文章

AngularJS動(dòng)態(tài)生成div的ID源碼解析
這篇文章主要介紹了基于AngularJS動(dòng)態(tài)生成div的ID,本文介紹的非常詳細(xì)，具有參考借鑒價(jià)值，對(duì)angularjs動(dòng)態(tài)生成div的id相關(guān)知識(shí)感興趣的朋友一起學(xué)習(xí)吧
2016-08-08
AngularJS基礎(chǔ) ng-srcset 指令簡(jiǎn)單示例
本文主要介紹AngularJS ng-srcset 指令,這里對(duì)ng-srcset 指令做了詳細(xì)的資料整理，附有代碼示例，有需要的小伙伴可以參考下
2016-08-08
Angular4如何自定義首屏的加載動(dòng)畫(huà)詳解
Angular應(yīng)用程序在首次加載根組件時(shí)會(huì)在瀏覽器的顯示一個(gè)loading...動(dòng)畫(huà)，下面這篇文章主要給大家介紹了關(guān)于Angular4如何自定義首屏加載動(dòng)畫(huà)的相關(guān)資料，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面跟著小編來(lái)一起看看吧。
2017-07-07
Angularjs過(guò)濾器實(shí)現(xiàn)動(dòng)態(tài)搜索與排序功能示例
這篇文章主要介紹了Angularjs過(guò)濾器實(shí)現(xiàn)動(dòng)態(tài)搜索與排序功能,涉及AngularJS過(guò)濾器相關(guān)搜索、查詢、排序操作技巧,需要的朋友可以參考下
2017-12-12
angular 動(dòng)態(tài)組件類(lèi)型詳解(四種組件類(lèi)型)
這篇文章給大家講解四種組件類(lèi)型，非常不錯(cuò)，具有參考借鑒價(jià)值，對(duì)angular 動(dòng)態(tài)組件類(lèi)型感興趣的朋友參考下吧
2017-02-02
淺談angular.js中實(shí)現(xiàn)雙向綁定的方法$watch $digest $apply
Angular用戶都想知道數(shù)據(jù)綁定是怎么實(shí)現(xiàn)的。你可能會(huì)看到各種各樣的詞匯：$watch,$apply,$digest它們是如何工作的呢？這里我想回答這些問(wèn)題，其實(shí)它們?cè)诠俜降奈臋n里都已經(jīng)回答了，但是我還是想把它們結(jié)合在一起來(lái)講
2015-10-10
angular內(nèi)置provider之$compileProvider詳解
下面小編就為大家?guī)?lái)一篇angular內(nèi)置provider之$compileProvider詳解。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2017-09-09
淺析angularJS中的ui-router和ng-grid模塊
下面小編就為大家?guī)?lái)一篇淺析angularJS中的ui-router和ng-grid模塊。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2016-05-05
AngularJs頁(yè)面篩選標(biāo)簽小功能
AngularJS 是一個(gè) JavaScript 框架。它可通過(guò) <script> 標(biāo)簽添加到 HTML 頁(yè)面。本文重點(diǎn)給大家介紹AngularJs頁(yè)面篩選標(biāo)簽小功能，非常不錯(cuò)，需要的朋友可以參考下
2016-08-08
詳解Angular中實(shí)現(xiàn)自定義組件的雙向綁定的兩種方法
這篇文章主要介紹了詳解Angular中實(shí)現(xiàn)自定義組件的雙向綁定的兩種方法，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧
2018-11-11