Dettagli di avvio di AngularJS bootstrap e codice di esempio

Per l'utente medio, ng-app di AngularJS è sempre collegato manualmente a un elemento DOM. Ma in alcune applicazioni, questo può essere molto scomodo.

Inizializzazione di binding

Attraverso il binding si inizializza Angular, inserendo il codice js nell'html, ma per i principianti è sufficiente!

<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>

Dopo l'esecuzione, verrà visualizzato hello,angular!

Inizializzazione manuale

Angular fornisce anche un api di collegamento manuale chiamato bootstrap, il modo di utilizzo è il seguente:

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

Tra i primi parametri element: è l'elemento DOM collegato a ng-app;

modules: nome del modulo collegato
config: configurazione aggiuntiva

Semplicemente guardiamo il codice:

<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>

Cosa è importante notare:

angular.bootstrap binding solo l'oggetto caricato per la prima volta.

Tutte le binding ripetute o altre binding di oggetti saranno visualizzate come messaggi di errore nel console.

Di seguito è la raccolta delle informazioni su AngularJS bootstrap, ulteriori informazioni verranno aggiunte in seguito, grazie per il supporto di tutti a questo sito!

Dichiarazione: il contenuto di questo articolo è stato raccolto da Internet, di proprietà dei rispettivi autori, il contenuto è stato contribuito e caricato autonomamente dagli utenti di Internet, questo sito non detiene i diritti di proprietà, non è stato sottoposto a editing umano e non assume alcuna responsabilità legale correlata. Se trovi contenuti sospetti di copyright, invia un'e-mail a: notice#oldtoolbag.com (al momento dell'invio dell'e-mail, sostituisci # con @) per segnalare il problema e fornire prove pertinenti. Una volta verificata, questo sito eliminerà immediatamente il contenuto sospetto di copyright.

Corso di base