Je n'ai rien écrit depuis longtemps et j'ai l'impression de ne pas savoir par où commencer à écrire des choses. Maintenant, je ferais mieux d'écrire quelque chose de technique en premier. Angularjs, mon frère l'a appelé "Mon frère JS"
1. Télécharger
La copie de code est la suivante:
官方网址：https://angularjs.org/
CDN：https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.5/angular.min.js
2. Bref introduction à l'utilisation de 1.ng-app
Détermine la portée des angularjs, vous pouvez l'utiliser comme suit
La copie de code est la suivante:
<html ng-app>
…
</html>
Laissez AngularJs rendre la page entière, vous pouvez également l'utiliser
La copie de code est la suivante:
<div ng-app = 'myapp'>
...
</div>
pour en faire une partie.
2.NG modèle
Ng-Model, lorsque votre modèle de données est modifié, par exemple ng-model = 'test', la valeur de ce test est modifiée, la valeur de {{test}} changera également, c'est-à-dire que le test connecté au modèle ng changera également, comme suit
La copie de code est la suivante:
<! doctype html>
<html>
<adal>
<script src = "angular.min.js" type = "text / javascript"> </ script>
<Title> Learing arguularjs - widuu </Title>
</ head>
<corps ng-app>
<entrée ng-model = 'test'> {{test}}
</docy>
</html>
3.Angular.Module
Ceci est principalement utilisé pour enregistrer, créer et indexer les modules. Par exemple, si nous souhaitons l'inscription en tant que service, nous devons l'utiliser lorsque nous nous référons à index un module. Nous devons également l'utiliser lorsque nous nous référons à l'index.
La copie de code est la suivante:
angular.module (nom, [nécessite], [configfn]);
# Name le nom du module de recherche créé par Type String
#Requires Une compréhension simple est le module d'utilisation que vous devez inclure, comme le module de routage NGOUTE
#configfn Le module de fonction facultatif, les fonctions sont similaires à module.config
4. contrôleur
Le contrôleur est le contrôleur de méthode (nom, constructeur); Lorsque le nom est le nom du contrôleur, le constructeur est le constructeur de contrôleur, nous utilisons un morceau de code pour illustrer
La copie de code est la suivante:
<! doctype html>
<html>
<adal>
<script src = "angular.min.js" type = "text / javascript"> </ script>
<script type = "text / javascript">
var app = angular.module ('myApp', []);
app.Controller ('MyTest', fonction ($ scope) {
$ scope.test = "Hello Word";
});
</cript>
<Title> Learing arguularjs - widuu </Title>
</ head>
<corps ng-app = 'myapp' ng-contrôleur = 'mytest'>
<entrée ng-model = 'test'> {{test}}
</docy>
</html>
5.Value
La valeur est également la valeur de la méthode (nom, objet); où le nom est le nom du service et de l'objet est l'objet d'instance de serveur. Pour le moment, nous pouvons modifier le code ci-dessus pour être corrigé comme celui-ci
La copie de code est la suivante:
<! doctype html>
<html>
<adal>
<script src = "angular.min.js" type = "text / javascript"> </ script>
<script type = "text / javascript">
var app = angular.module ('myapp', [])
.Value («testvalue», «mot»);
app.Controller ('myTest', fonction ($ scope, testvalue) {
$ scope.test = "Hello" + testValue;
});
</cript>
<Title> Learing arguularjs - widuu </Title>
</ head>
<corps ng-app = 'myapp' ng-contrôleur = 'mytest'>
<entrée ng-model = 'test'> {{test}}
</docy>
</html>
5.Factory
L'usine est également la méthode Factory (nom, prestatorfunction) ;; Lorsque le nom est le nom du service, ProviderFunction est une fonction utilisée pour créer un nouvel objet de serveur. Pour le moment, nous pouvons modifier le code ci-dessus pour être corrigé comme celui-ci
La copie de code est la suivante:
<! doctype html>
<html>
<adal>
<script src = "angular.min.js" type = "text / javascript"> </ script>
<script type = "text / javascript">
var app = angular.module ('myapp', [])
.Value («testvalue», «widuu»)
.factory ('TestFactory', fonction (testValue) {
retourner{
lable: function () {
return "Ceci peut sortir: bonjour" + testvalue;
}
}
});
app.Controller ('MyTest', fonction ($ scope, testvalue, testfactory) {
$ scope.test = "Hello" + testValue;
$ scope.output = testfactory.lable ();
});
</cript>
<Title> Learing arguularjs - widuu </Title>
</ head>
<corps ng-app = 'myapp' ng-contrôleur = 'mytest'>
<entrée ng-model = 'test'> {{test}}
</p>
{{sortir}}
</docy>
</html>
6.Provider
Le fournisseur est également le fournisseur de méthodes dans le fournisseur angulaire.module (nom, fournisseur de type); où le nom est le nom du service et que ProviderFunction est une fonction utilisée pour créer un nouvel objet de serveur. Ceci est similaire à l'usine. Nous le réécrivons maintenant avec le fournisseur.
La copie de code est la suivante:
<! doctype html>
<html>
<adal>
<script src = "angular.min.js" type = "text / javascript"> </ script>
<script type = "text / javascript">
var app = angular.module ('myapp', [])
.Value («testvalue», «widuu»)
.Provider («TestProvider»,
fonction(){
this.lable = "Ceci sera sorti: bonjour widuu";
this. $ get = function () {
retourner ceci;
}
}
));
app.Controller ('MyTest', fonction ($ scope, testValue, testProvider) {
$ scope.test = "Hello" + testValue;
$ scope.output = TestProvider.lable;
});
</cript>
<Title> Learing arguularjs - widuu </Title>
</ head>
<corps ng-app = 'myapp' ng-contrôleur = 'mytest'>
<entrée ng-model = 'test'> {{test}}
</p>
{{sortir}}
</docy>
</html>
7.
Le service est également le service de méthode (nom, constructeur); Lorsque le nom est le nom du service, le constructeur est un constructeur qui sera instancié. Ceci est similaire à l'usine. Nous le réécrivons maintenant avec le service
La copie de code est la suivante:
<! doctype html>
<html>
<adal>
<script src = "angular.min.js" type = "text / javascript"> </ script>
<script type = "text / javascript">
var app = angular.module ('myapp', [])
.Value («testvalue», «widuu»)
.Service ('TestService',
fonction (testValue) {
this.lable = function () {
return "this sera sorti: bonjour" + testvalue;
}
}
));
app.Controller ('MyTest', fonction ($ scope, testValue, testService) {
$ scope.test = "Hello" + testValue;
$ scope.output = TestService.lable ();
});
</cript>
<Title> Learing arguularjs - widuu </Title>
</ head>
<corps ng-app = 'myapp' ng-contrôleur = 'mytest'>
<entrée ng-model = 'test'> {{test}}
</p>
{{sortir}}
</docy>
</html>
8.
constant est également la méthode constante (nom, objet); Lorsque le nom est le nom de la constante, et l'objet est la valeur de la constante, nous pouvons l'écrire comme ceci
La copie de code est la suivante:
<! doctype html>
<html>
<adal>
<script src = "angular.min.js" type = "text / javascript"> </ script>
<script type = "text / javascript">
var app = angular.module ('myapp', [])
.Value («testvalue», «widuu»)
.Constant ('Count', 23)
.Service ('TestService',
fonction (testvalue, count) {
this.lable = function () {
Retour "Ce sera sorti: bonjour" + testvalue + ", l'âge est" + count;
}
}
));
app.Controller ('MyTest', fonction ($ scope, testValue, testService) {
$ scope.test = "Hello" + testValue;
$ scope.output = TestService.lable ();
});
</cript>
<Title> Learing arguularjs - widuu </Title>
</ head>
<corps ng-app = 'myapp' ng-contrôleur = 'mytest'>
<entrée ng-model = 'test'> {{test}}
</p>
{{sortir}}
</docy>
</html>
C’est tout aujourd'hui et continue de le faire plus tard.