Não escrevo nada há muito tempo e sinto que não sei por onde começar a escrever coisas. Agora é melhor escrever algo técnico primeiro. Angularjs, meu irmão chamou de "meu irmão JS"
1. Download
A cópia do código é a seguinte:
官方网址：https://angularjs.org/
CDN：https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.5/angular.min.js
2. Breve Introdução ao uso de 1.ng-App
Determina o escopo dos angulares, você pode usá -lo da seguinte forma
A cópia do código é a seguinte:
<html ng-app>
...
</html>
Deixe o Angularjs renderizar a página inteira, você também pode usá -la
A cópia do código é a seguinte:
<div ng-app = 'myApp'>
...
</div>
para tornar uma parte disso.
2.NG-Modelo
Modelo Ng, quando seu modelo de dados é alterado, por exemplo, ng-model = 'teste', o valor deste teste é alterado, o valor de {{test}} também mudará, ou seja, o teste conectado ao modelo NG também mudará, da seguinte maneira
A cópia do código é a seguinte:
<! doctype html>
<html>
<head>
<script src = "angular.min.js" type = "text/javascript"> </sCript>
<title> Learing ArgularJS-Widuu </ititle>
</head>
<corpo ng-app>
<input ng-model = 'test'> {{test}}
</body>
</html>
3.angular.module
Isso é usado principalmente para se registrar, criar e indexar módulos. Por exemplo, se queremos registrar isso como um serviço, precisamos usá -lo quando nos referirmos ao indexado de um módulo. Também precisamos usá -lo quando nos referimos ao índice.
A cópia do código é a seguinte:
angular.module (nome, [requer], [configfn]);
#Name o nome do módulo de pesquisa criado por String Type
#Requises Um entendimento simples é o módulo de uso que você precisa incluir, como o módulo de roteamento NGROUTE
#configfn O módulo de função opcional, as funções são semelhantes a Module.config
4. Controlador
controlador é o controlador de método (nome, construtor); Onde o nome é o nome do controlador, o construtor é o construtor do controlador, usamos um pedaço de código para ilustrar
A cópia do código é a seguinte:
<! doctype html>
<html>
<head>
<script src = "angular.min.js" type = "text/javascript"> </sCript>
<script type = "text/javascript">
var app = angular.module ('myApp', []);
App.Controller ('MyTest', função ($ scope) {
$ scope.test = "hello word";
});
</script>
<title> Learing ArgularJS-Widuu </ititle>
</head>
<corpo ng-app = 'myApp' ng-controller = 'mytest'>
<input ng-model = 'test'> {{test}}
</body>
</html>
5.Value
O valor também é o valor do método (nome, objeto); onde o nome é o nome do serviço e o objeto é o objeto da instância do servidor. Neste momento, podemos modificar o código acima para ser corrigido assim
A cópia do código é a seguinte:
<! doctype html>
<html>
<head>
<script src = "angular.min.js" type = "text/javascript"> </sCript>
<script type = "text/javascript">
var app = angular.module ('myApp', [])
.Value ('testValue', 'word');
App.Controller ('MyTest', função ($ scope, testValue) {
$ scope.test = "hello"+ testValue;
});
</script>
<title> Learing ArgularJS-Widuu </ititle>
</head>
<corpo ng-app = 'myApp' ng-controller = 'mytest'>
<input ng-model = 'test'> {{test}}
</body>
</html>
5.Factory
A fábrica também é a fábrica de métodos (nome, função prover) ;; Onde o nome é o nome do serviço, o provedorfunção é uma função usada para criar um novo objeto de servidor. Neste momento, podemos modificar o código acima para ser corrigido assim
A cópia do código é a seguinte:
<! doctype html>
<html>
<head>
<script src = "angular.min.js" type = "text/javascript"> </sCript>
<script type = "text/javascript">
var app = angular.module ('myApp', [])
.Value ('testValue', 'widuu')
.Factory ('testFactory', function (testValue) {
retornar{
Lable: function () {
retornar "Isso pode ser lançado: olá"+ testValue;
}
}
});
App.Controller ('MyTest', função ($ scope, testValue, testFactory) {
$ scope.test = "hello"+ testValue;
$ scope.Output = testFactory.Lable ();
});
</script>
<title> Learing ArgularJS-Widuu </ititle>
</head>
<corpo ng-app = 'myApp' ng-controller = 'mytest'>
<input ng-model = 'test'> {{test}}
</p>
{{saída}}
</body>
</html>
6. Provider
Provedor também é o provedor de métodos no Angular.Module Provedor (Nome, ProviderType); Onde o nome é o nome do serviço e o provedorfunção é uma função usada para criar um novo objeto de servidor. Isso é semelhante à fábrica. Agora estamos reescrevendo -o com o provedor.
A cópia do código é a seguinte:
<! doctype html>
<html>
<head>
<script src = "angular.min.js" type = "text/javascript"> </sCript>
<script type = "text/javascript">
var app = angular.module ('myApp', [])
.Value ('testValue', 'widuu')
.Provider ('TestProvider',
função(){
this.Lable = "Isso será lançado: olá widuu";
isto. $ get = function () {
devolver isso;
}
}
);
App.Controller ('MyTest', função ($ SCOPE, TestValue, TestProvider) {
$ scope.test = "hello"+ testValue;
$ scope.Output = testProvider.Lable;
});
</script>
<title> Learing ArgularJS-Widuu </ititle>
</head>
<corpo ng-app = 'myApp' ng-controller = 'mytest'>
<input ng-model = 'test'> {{test}}
</p>
{{saída}}
</body>
</html>
7. Serviço
Serviço também é o serviço de método (nome, construtor); Onde o nome é o nome do serviço, o construtor é um construtor que será instanciado. Isso é semelhante à fábrica. Agora estamos reescrevendo com serviço
A cópia do código é a seguinte:
<! doctype html>
<html>
<head>
<script src = "angular.min.js" type = "text/javascript"> </sCript>
<script type = "text/javascript">
var app = angular.module ('myApp', [])
.Value ('testValue', 'widuu')
.Service ('TestService',
função (testValue) {
this.Lable = function () {
retornar "Isso será lançado: olá"+testValue;
}
}
);
App.Controller ('MyTest', função ($ SCOPE, TestValue, TestService) {
$ scope.test = "hello"+ testValue;
$ scope.Output = testService.Lable ();
});
</script>
<title> Learing ArgularJS-Widuu </ititle>
</head>
<corpo ng-app = 'myApp' ng-controller = 'mytest'>
<input ng-model = 'test'> {{test}}
</p>
{{saída}}
</body>
</html>
8. Constant
constante também é o método constante (nome, objeto); onde o nome é o nome da constante, e objeto é o valor da constante, podemos escrever assim
A cópia do código é a seguinte:
<! doctype html>
<html>
<head>
<script src = "angular.min.js" type = "text/javascript"> </sCript>
<script type = "text/javascript">
var app = angular.module ('myApp', [])
.Value ('testValue', 'widuu')
.Constant ('contagem', 23)
.Service ('TestService',
função (testValue, contagem) {
this.Lable = function () {
Retornar "Isso será lançado: Hello"+testValue+", a idade é"+contagem;
}
}
);
App.Controller ('MyTest', função ($ SCOPE, TestValue, TestService) {
$ scope.test = "hello"+ testValue;
$ scope.Output = testService.Lable ();
});
</script>
<title> Learing ArgularJS-Widuu </ititle>
</head>
<corpo ng-app = 'myApp' ng-controller = 'mytest'>
<input ng-model = 'test'> {{test}}
</p>
{{saída}}
</body>
</html>
Isso é tudo hoje e continue a fazê -lo mais tarde.