interface Web
js tutoriel
Exemple de code expliquant comment implémenter l'interaction entre les contrôleurs et les instructions dans AngularJS
Exemple de code expliquant comment implémenter l'interaction entre les contrôleurs et les instructions dans AngularJS
Cet article présente principalement l'explication détaillée de la façon d'implémenter l'interaction entre le contrôleur et les instructions dans angularjs Il a une certaine valeur de référence. êtes intéressés Amis, vous pouvez vous référer à
Si nous avons la structure DOM suivante :
<p ng-controller="MyCtrl"> <loader>滑动加载</loader> </p>
En même temps, notre contrôleur a la signature suivante :
var myModule = angular.module("MyModule", []);
//首先定义一个模块并在模块下挂载控制器，第二个参数为一个数组，其中函数前面的参数都是会被注入到函数形参上面的
myModule.controller('MyCtrl', ['$scope', function($scope){
$scope.loadData=function(){
console.log("加载数据中...");
}
}]);En même temps, la signature de la commande est la suivante :
myModule.directive("loader", function() {
return {
restrict:"AE",//Element,Attribute
link:function(scope,element,attrs){
element.bind('mouseenter', function(event) {
//scope.loadData();
// scope.$apply("loadData()");
// 注意这里的坑，howToLoad会被转换成小写的howtoload
});
}
}
});À ce moment, notre instruction peut terminer l'appel au contrôleur via scope.loadData ou scope.$apply. Mais que se passe-t-il si nous avons deux contrôleurs ? Et que les méthodes dans $scope sont différentes dans les deux contrôleurs ?
var myModule = angular.module("MyModule", []);
//首先定义一个模块并在模块下挂载控制器，第二个参数为一个数组，其中函数前面的参数都是会被注入到函数形参上面的
myModule.controller('MyCtrl', ['$scope', function($scope){
$scope.loadData=function(){
console.log("加载数据中...");
}
}]);
myModule.controller('MyCtrl2', ['$scope', function($scope){
$scope.loadData2=function(){
console.log("加载数据中...22222");
}
}]);Comment appeler la méthode dans nos instructions à ce moment-là, selon la méthode ci-dessus. Ensuite, nous allons faire face à un problème : MyCtrl2 n'a pas notre loadData, mais seulement loadData2 ! Pour le moment, nous devons utiliser les instructions suivantes pour personnaliser l'attribut
Nous avons défini deux contrôles de contrôleur Les contrôleurs. sont respectivement MyCtrl et MyCtrl2. Les deux contrôleurs utilisent nos propres instructions définies pour charger :
<!doctype html>
<html ng-app="MyModule">
<head>
<meta charset="utf-8">
</head>
<body>
<!--第一个控制器MyCtrl-->
<p ng-controller="MyCtrl">
<loader howToLoad="loadData()">滑动加载</loader>
</p>
<!--第二个控制器MyCtrl2-->
<p ng-controller="MyCtrl2">
<loader howToLoad="loadData2()">滑动加载</loader>
</p>
</body>
<script src="framework/angular-1.3.0.14/angular.js"></script>
<script src="Directive&Controller.js"></script>
</html>Nous avons personnalisé le code du contrôleur comme suit :
var myModule = angular.module("MyModule", []);
//首先定义一个模块并在模块下挂载控制器，第二个参数为一个数组，其中函数前面的参数都是会被注入到函数形参上面的
myModule.controller('MyCtrl', ['$scope', function($scope){
$scope.loadData=function(){
console.log("加载数据中...");
}
}]);
myModule.controller('MyCtrl2', ['$scope', function($scope){
$scope.loadData2=function(){
console.log("加载数据中...22222");
}
}]);
//在模块下挂载一个loader指令
myModule.directive("loader", function() {
return {
restrict:"AE",//Element,Attribute
link:function(scope,element,attrs){
element.bind('mouseenter', function(event) {
//scope.loadData();
// scope.$apply("loadData()");
// 注意这里的坑，howToLoad会被转换成小写的howtoload
// scope.$apply(attrs.howtoload);
//其中scope为POJO，但是有一系列的工具方法如$watch,$apply等
});
}
}
}); Très évidemment, il y a deux contrôleurs ici. , à savoir MyCtrl et MyCtrl2. Comment notre instruction sait-elle quel contrôleur appeler ? À ce stade, nous devons spécifier différents attributs pour nos instructions et utiliser cet attribut pour juger différents appels de contrôleur, afin que nous puissions appeler les instructions de différentes manières. contrôleurs !
Résumé : La raison pour laquelle les instructions sont définies est pour la réutilisation. Afin de permettre aux instructions d'interagir avec différents contrôleurs, différentes configurations seront définies pour l'élément d'instructions, c'est le principe. d'interaction de données entre les instructions et les contrôleurs !
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!
Outils d'IA chauds
Undresser.AI Undress
Application basée sur l'IA pour créer des photos de nu réalistes
AI Clothes Remover
Outil d'IA en ligne pour supprimer les vêtements des photos.
Undress AI Tool
Images de déshabillage gratuites
Clothoff.io
Dissolvant de vêtements AI
AI Hentai Generator
Générez AI Hentai gratuitement.
Article chaud
Outils chauds
Bloc-notes++7.3.1
Éditeur de code facile à utiliser et gratuit
SublimeText3 version chinoise
Version chinoise, très simple à utiliser
Envoyer Studio 13.0.1
Puissant environnement de développement intégré PHP
Dreamweaver CS6
Outils de développement Web visuel
SublimeText3 version Mac
Logiciel d'édition de code au niveau de Dieu (SublimeText3)
Comment calibrer correctement votre manette Xbox One sous Windows 11
Sep 21, 2023 pm 09:09 PM
Depuis que Windows est devenu la plate-forme de jeu de choix, il est encore plus important d'identifier ses fonctionnalités orientées jeux. L'un d'eux est la possibilité de calibrer une manette Xbox One sur Windows 11. Grâce à l'étalonnage manuel intégré, vous pouvez vous débarrasser des problèmes de dérive, de mouvement aléatoire ou de performances et aligner efficacement les axes X, Y et Z. Si les options disponibles ne fonctionnent pas, vous pouvez toujours utiliser un outil tiers d'étalonnage du contrôleur Xbox One. Découvrons-le ! Comment calibrer ma manette Xbox sous Windows 11 ? Avant de continuer, assurez-vous de connecter votre manette à votre ordinateur et de mettre à jour les pilotes de votre manette Xbox One. Pendant que vous y êtes, installez également toutes les mises à jour de micrologiciel disponibles. 1. Utilisez le vent
Comment obtenir des objets à l'aide de commandes dans Terraria ? -Comment collecter des objets dans Terraria ?
Mar 19, 2024 am 08:13 AM
Comment obtenir des objets à l'aide de commandes dans Terraria ? 1. Quelle est la commande pour donner des objets dans Terraria ? Dans le jeu Terraria, donner des commandes à des objets est une fonction très pratique. Grâce à cette commande, les joueurs peuvent obtenir directement les objets dont ils ont besoin sans avoir à combattre des monstres ou à se téléporter vers un certain endroit. Cela peut grandement faire gagner du temps, améliorer l’efficacité du jeu et permettre aux joueurs de se concentrer davantage sur l’exploration et la construction du monde. Dans l’ensemble, cette fonctionnalité rend l’expérience de jeu plus fluide et plus agréable. 2. Comment utiliser Terraria pour donner des commandes d'objets 1. Ouvrez le jeu et entrez dans l'interface du jeu. 2. Appuyez sur la touche "Entrée" du clavier pour ouvrir la fenêtre de discussion. 3. Entrez le format de commande dans la fenêtre de discussion : "/give[player name][item ID][itemQuantity]".
Démarrage rapide de VUE3 : utiliser les instructions de Vue.js pour changer d'onglet
Jun 15, 2023 pm 11:45 PM
Cet article vise à aider les débutants à démarrer rapidement avec Vue.js3 et à obtenir un simple effet de changement d'onglet. Vue.js est un framework JavaScript populaire qui peut être utilisé pour créer des composants réutilisables, gérer facilement l'état de votre application et gérer les interactions de l'interface utilisateur. Vue.js3 est la dernière version du framework Par rapport aux versions précédentes, il a subi des changements majeurs, mais les principes de base n'ont pas changé. Dans cet article, nous utiliserons les instructions de Vue.js pour implémenter l'effet de changement d'onglet, dans le but de familiariser les lecteurs avec Vue.js.
Apprendre Laravel à partir de zéro : explication détaillée de l'invocation de la méthode du contrôleur
Mar 10, 2024 pm 05:03 PM
Apprendre Laravel à partir de zéro : explication détaillée de l'invocation de la méthode du contrôleur Dans le développement de Laravel, le contrôleur est un concept très important. Le contrôleur sert de pont entre le modèle et la vue, responsable du traitement des demandes des itinéraires et du renvoi des données correspondantes à la vue pour affichage. Les méthodes des contrôleurs peuvent être appelées par des routes. Cet article présentera en détail comment écrire et appeler des méthodes dans les contrôleurs et fournira des exemples de code spécifiques. Tout d’abord, nous devons créer un contrôleur. Vous pouvez utiliser l'outil de ligne de commande Artisan pour créer
Comment utiliser le framework CodeIgniter4 en php ?
May 31, 2023 pm 02:51 PM
PHP est un langage de programmation très populaire et CodeIgniter4 est un framework PHP couramment utilisé. Lors du développement d'applications Web, l'utilisation de frameworks est très utile. Elle peut accélérer le processus de développement, améliorer la qualité du code et réduire les coûts de maintenance. Cet article expliquera comment utiliser le framework CodeIgniter4. Installation du framework CodeIgniter4 Le framework CodeIgniter4 peut être téléchargé depuis le site officiel (https://codeigniter.com/). Vers le bas
Qu'est-ce que le contrôleur Laravel
Jan 14, 2023 am 11:16 AM
Dans Laravel, un contrôleur (Controller) est une classe utilisée pour implémenter certaines fonctions ; le contrôleur peut combiner la logique de traitement des requêtes associée dans une classe distincte. Certaines méthodes sont stockées dans le contrôleur pour implémenter certaines fonctions. Le contrôleur est appelé via le routage, et les fonctions de rappel ne sont plus utilisées ; le contrôleur est stocké dans le répertoire « app/Http/Controllers ».
Guide d'étude Laravel : meilleures pratiques pour les appels de méthode de contrôleur
Mar 11, 2024 am 08:27 AM
Dans le guide d'apprentissage Laravel, l'appel des méthodes du contrôleur est un sujet très important. Les contrôleurs servent de pont entre le routage et les modèles et jouent un rôle essentiel dans l'application. Cet article présentera les meilleures pratiques en matière d’appel de méthode de contrôleur et fournira des exemples de code spécifiques pour aider les lecteurs à mieux comprendre. Commençons par comprendre la structure de base des méthodes de contrôleur. Dans Laravel, les classes de contrôleurs sont généralement stockées dans le répertoire app/Http/Controllers. Chaque classe de contrôleur en contient plusieurs.
Les 5 derniers tutoriels Angularjs en 2022, de l'entrée à la maîtrise
Jun 15, 2017 pm 05:50 PM
Javascript est un langage tout à fait unique. Il est unique en termes d'organisation du code, de paradigme de programmation du code et de théorie orientée objet. La question de savoir si Javascript est un langage orienté objet a été débattue depuis un certain temps. Il y a évidemment une réponse depuis longtemps. Cependant, même si Javascript est dominant depuis vingt ans, si vous souhaitez comprendre les frameworks populaires tels que jQuery, Angularjs et même React, il suffit de regarder le « Black Horse Cloud Classroom JavaScript Advanced Framework ». Tutoriel vidéo de conception".
