angularjs moduł
Moduł definiuje aplikację.
Moduł jest pojemnik w różnych aplikacji.
Moduł Controller jest aplikacją kontenera.
Kontroler zazwyczaj należą do modułu.
Utwórz moduł
Można utworzyć moduł przez angularjs z funkcjąangular.module:
<Script>
var app = angular.module ( "myApp" , []);
Parametr "MojaApl" odnosi się do wykonania elementów HTML aplikacji.
Teraz można dodania kontrolera instrukcje, filtry, itp aplikacji angularjs.
Dodaj Controller
Można użyć instrukcjing-kontrolera, aby dodać aplikacje Kontroler:
angularjs przykłady
{{FirstName + "" + lastName }}
</ Div>
<Script>
app.controller ( "myCtrl", function ( $ zakres) {
$ Scope.firstName = "John";
$ Scope.lastName = "Kowalski";
});
Spróbuj »
Można angularjs Kontrolery uzyskania dalszych informacji na temat sekcji kontrolera.
Dodaj instrukcjami
Angularjs oferuje wiele wbudowanych poleceń, można z nich korzystać, aby dodać funkcjonalność aplikacji.
Pełne instrukcje można znaleźć w treści angularjs podręcznika .
Ponadto, można użyć modułu do dodawania własnych aplikacji instrukcji:
angularjs przykłady
<Script>
app.directive ( "w3bigDirective", function ( ) {
powrót {
Szablon: "I stworzył konstruktora instrukcji!"
};
});
Spróbuj »
Można angularjs dyrektyw uzyskania dalszych informacji na temat sekcji instrukcji.
Moduły i kontrolery zawarte w pliku JS
Zazwyczaj angularjs modułu aplikacji i sterownik jest zawarty w pliku JavaScript.
W poniższych przykładach, "myApp.js" zawiera definicji stosowanych modułów programu "myCtrl.js" plik zawiera kontroler:
angularjs przykłady
<Html>
<Script src = "http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"> </ script>
<Body>
<Div ng-app = "myApp " NG-controller = "myCtrl">
{{FirstName + "" + lastName }}
</ Div>
<Script src = "myApp.js"> </ script>
<Script src = "myCtrl.js"> </ script>
</ Body>
</ Html>
Spróbuj »
myApp.js
W definicji modułu [] Parametr ten jest stosowany w celu określenia zależności modułu. Nawiasy [] wskazuje, że moduł nie opierają się, czy istnieje zależność, to zależy od nazwą modułu w nawiasach. |
myCtrl.js
$scope.firstName = "John";
$scope.lastName= "Doe";
});
Działanie będzie wpływać na globalną przestrzeń nazw
JavaScript powinny unikać korzystania z funkcji globalnych. Ponieważ mogą one być łatwo pokryte innym pliku skryptu.
Angularjs zakresu modułu tak, aby wszystkie funkcje w module, aby uniknąć tego problemu.
Po załadowaniu biblioteki?
W naszym przykładzie, wszystkie biblioteki dokumentów angularjs HTML są ładowane w głowę. |
Dla aplikacji HTML jest zalecane dla wszystkich skryptów są umieszczone w dolnej części elementu <body>.
Zwiększy to prędkość ładowania strony, ponieważ HTML nie podlega załadować skryptu do załadowania.
W naszym przykładzie wielu angularjs, widać angularjs biblioteka jest załadowany do obszaru <head> dokumentu.
W naszym przykładzie angularjs w sekcji <head> element jest załadowany, ponieważ wywołanie angular.module być wykonywane wyłącznie po zakończeniu ładowania biblioteki.
Innym rozwiązaniem jest załadowanie angularjs biblioteki elementu <body>, ale muszą być umieszczone w przedniej części skryptu angularjs:
angularjs przykłady
<Html>
<Head>
<Meta charset = "utf-8 ">
<Script src = "http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"> </ script>
</ Head>
<Body>
<Div ng-app = "myApp " NG-controller = "myCtrl">
{{FirstName + "" + lastName }}
</ Div>
<Script>
var app = angular.module ( "myApp", []);
app.controller ( "myCtrl", function ($ zakres) {
$ Scope.firstName = "John";
$ Scope.lastName = "Kowalski";
});
</ Script>
</ Body>
</ Html>
Spróbuj »