AngularJS módulo
Módulo define um aplicativo.
Módulo é um recipiente em diferentes partes da aplicação.
módulo controlador é um aplicativo de contêiner.
O controlador geralmente pertencem a um módulo.
Criar um módulo
Você pode criar um módulo por AngularJS da funçãoangular.module:
<Script>
var app = angular.module ( "myApp" , []);
parâmetro "MyApp" corresponde à execução dos elementos aplicativo HTML.
Agora você pode adicionar um controlador de instruções, filtros, etc, em aplicações AngularJS.
Adicionar Controlador
Você pode usar instruçõesng-controlador para adicionar controlador de aplicações:
AngularJS exemplos
{{FirstName + "" + lastName }}
</ Div>
<Script>
app.controller ( "myCtrl", function ( $ escopo) {
$ Scope.firstName = "John";
$ Scope.lastName = "Doe";
});
tente »
Você pode AngularJS Controladores de obter mais informação sobre a secção do controlador.
Adicionar instruções
AngularJS fornece muitos comandos internos, você pode usá-los para adicionar funcionalidades ao seu aplicativo.
As instruções completas podem ser encontradas no conteúdo do manual de referência AngularJS .
Além disso, você pode usar o módulo para adicionar seus próprios aplicativos de instrução:
AngularJS exemplos
<Script>
app.directive ( "w3bigDirective", function ( ) {
retornar {
template: "Eu criei o construtor de instrução!"
};
});
tente »
Você pode directivas AngularJS obter mais informação sobre a seção de instruções.
Módulos e controladores incluídos no arquivo JS
Normalmente AngularJS módulo de aplicação e o controlador está incluído no arquivo JavaScript.
Nos exemplos a seguir, "myApp.js" contém a definição dos módulos de aplicação do programa, "myCtrl.js" arquivo contém o controlador:
AngularJS exemplos
<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>
tente »
myApp.js
 | Na definição de módulo [] parâmetro é usado para definir as dependências do módulo. Suportes [] indica que o módulo não depende de, se existe dependência, em seguida, vai depender do nome do módulo escrita em parênteses. |
|---|
myCtrl.js
$scope.firstName = "John";
$scope.lastName= "Doe";
});
Função afetará o namespace global
JavaScript deve evitar o uso de funções globais. Porque eles podem ser facilmente coberto com outro arquivo script.
AngularJS escopo do módulo de modo a que todas as funções do módulo, a fim de evitar o problema.
Ao carregar a biblioteca?
| No nosso exemplo, todas as bibliotecas de documentos AngularJS HTML são carregados na cabeça. |
|---|
Para aplicações HTML é geralmente recomendado para todos os scripts são colocados na parte inferior do elemento <body>.
Isto irá aumentar a velocidade de carregamento da página, porque o HTML não está sujeito a carregar script para carregar.
No nosso exemplo múltiplas AngularJS, você verá biblioteca AngularJS é carregado no <head> do documento.
No nosso exemplo, AngularJS no elemento <head> é carregado, porque a chamada para angular.module só pode ser realizada após a conclusão do carregamento da biblioteca.
Outra solução é carregar a biblioteca AngularJS elemento <body>, mas deve ser colocado na frente de seu script AngularJS:
AngularJS exemplos
<Html>
<Head>
<Charset Meta = "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 ($ escopo) {
$ Scope.firstName = "John";
$ Scope.lastName = "Doe";
});
</ Script>
</ Body>
</ Html>
tente »