1. Quel mécanisme est utilisé pour la liaison de données dans Angular ?
Réponseprincipale détaillée
: mécanisme de vérification sale.
Analyse :
la liaison de données bidirectionnelle est l'un des mécanismes de base d'AngularJS. Lorsque des données changent dans la vue, elles seront mises à jour dans le modèle. Lorsque les données du modèle changent, la vue sera également mise à jour de manière synchrone, cela nécessite évidemment une surveillance. [Recommandation du didacticiel connexe : "Tutoriel Angular"]
Le principe est qu'Angular définit une file d'attente d'écoute sur le modèle de portée pour surveiller les modifications des données et mettre à jour la vue. Chaque fois que vous liez quelque chose à une vue, AngularJS insérera un $watch dans la file d'attente $watch pour détecter s'il y a des changements dans le modèle qu'il surveille. Lorsque le navigateur reçoit un événement pouvant être traité par le contexte angulaire, la boucle $digest est déclenchée, parcourt toutes les $watches et met enfin à jour le dom.
2. Comment la liaison de données bidirectionnelle d'AngularJS est-elle implémentée ?
Réponse :
1. Chaque élément lié dans les deux sens a un observateur.
2. Lorsque certains événements se produisent, la détection des données sales est appelée.
Ces événements incluent : les modifications de contenu des éléments de formulaire, les réponses aux requêtes Ajax, les fonctions exécutées en cliquant sur des boutons, etc.
3. La détection des données sales détectera tous les éléments d'observation sous le rootscope.
La fonction $digest est la surveillance des données sales
3. Quels plug-ins tiers avez-vous utilisés dans le développement du projet AngularJS
Réponse : AngularUi ui-router oclazyload, etc. Vous trouverez ci-joint un article pour examiner de plus près https://segmentfault. com/a /1190000003858219
4. Quelle est la différence entre ng-show/ng-hide et ng-if ?
Réponse : Nous savons tous que ng-show/ng-hide se cache et s'affiche via display. Et ng-if contrôle en fait l'ajout et la suppression de nœuds dom. Par conséquent, si nous chargeons des nœuds dom en fonction de conditions différentes, alors les performances de ng-if sont meilleures que celles de ng-show
5. Expliquez ce qu'est root S crope et la différence entre celui-ci et rootScrope, rootScrope et scope ?
Réponse : En termes simples, la page root S crope est le père de toutes les pages rootScrope, de toutes les pages rootScrope et de toutes les étendues.
Analyse :
Voyons comment générer root S cope et rootScope et rootScope et scope.
étape 1 : Angular analyse ng-app et crée $rootScope en mémoire.
étape 2 : angular continue l'analyse, trouve l'expression {{}} et l'analyse dans une variable.
étape 3 : Ensuite, le div avec ng-controller sera analysé et pointé vers une fonction de contrôleur. À ce stade, la fonction du contrôleur devient une instance d’objet $scope.
6. Énumérez au moins trois façons de mettre en œuvre la communication entre différents modules ?
Réponse :
7. Expression { Comment fonctionne {yourModel}} ?
Réponse :
Il s'appuie sur le service $interpolation. Après avoir initialisé la page html, il trouvera ces expressions et les marquera, donc à chaque fois qu'il rencontrera un { {}}, une $watch sera définie. Et $interpolation renverra une fonction avec des paramètres de contexte lorsque la fonction est finalement exécutée, l'expression $parse est appliquée à cette portée.
8. $http dans angulaire
Réponse : $http est un service principal d'AngularJS, utilisé pour lire des données à partir de serveurs distants.
Nous pouvons utiliser le service http intégré pour communiquer directement avec le monde extérieur. Le service http communique directement avec le monde extérieur. Le service http communique directement avec le monde extérieur. Le service http encapsule simplement l'objet XMLHttpRequest natif du navigateur.
9. Lorsque ng-repeat itère un tableau, s'il y a les mêmes valeurs dans le tableau, que se passera-t-il et comment le résoudre ?
Réponse : Il sera demandé que les doublons dans un répéteur ne soient pas autorisés. Ajoutez une piste par $index pour résoudre le problème. Bien sûr, vous pouvez également tracer par n'importe quelle valeur ordinaire, à condition qu'elle puisse identifier de manière unique chaque élément du tableau (établir l'association entre dom et data)
10. La réponse du framework angulairejs mvc ou mvvm
:analyse
mvvm
:d'abord élaborée. Voici votre compréhension de mvc et mvvm :
tout d'abord, pourquoi avons-nous besoin de MVC ? Parce qu'à mesure que la taille du code devient de plus en plus grande, la division des responsabilités est la tendance générale, et pour faciliter la maintenance ultérieure, la modification d'une fonction n'affecte pas les autres fonctions. Et pour la réutilisation, car une grande partie de la logique est la même. MVC n'est qu'un moyen, le but ultime est la modularisation et la réutilisation.
Les avantages de mvvm
sont un faible couplage : la vue peut être changée et modifiée indépendamment du modèle, et le même ViewModel peut être réutilisé par plusieurs vues ; et les modifications dans la vue et le modèle peuvent être indépendantes les unes des autres :
une certaine logique de vue peut être réutilisée ; placés dans ViewModel, plusieurs vues peuvent être réutilisées ;
développement indépendant : les développeurs peuvent se concentrer sur le développement de la logique métier et des données (ViewModemvvmdi ; les concepteurs peuvent se concentrer sur la conception de l'interface utilisateur (View) ;
testabilité : une superposition claire des vues permet de plus facile et plus simple de tester la logique métier de la couche de présentation.
En angulaire, le modèle MVVM est principalement divisé en quatre parties :
Vue : Il se concentre sur l'affichage et le rendu de l'interface. En angulaire,
il contient un tas de vues directives déclaratives. modèles.
: C'est le lien entre View et Model, responsable de l'interaction et de la collaboration entre View et Model. Il est chargé de fournir les données affichées à View et de fournir un moyen pour l'événement Command dans View d'exploiter le modèle de manière angulaire. l'objet $scope sert à cela Le rôle de ViewModel ;
Modèle : Il s'agit d'un support d'encapsulation de données liées à la logique métier de l'application. Le modèle ne se soucie pas de la manière dont il sera affiché ou. exploité, de sorte que le modèle ne contiendra aucune information relative à l'affichage de l'interface. Dans les pages Web, la plupart des modèles renvoient des données du serveur Ajax ou sont des objets de configuration globale et le service en angulaire est l'endroit pour encapsuler et traiter la logique métier ; lié au modèle. Ce type d'activité Un service est un service de domaine qui peut être réutilisé par plusieurs Controllers ou d'autres services
Controller : Ce n'est pas l'élément central du pattern MVVM, mais il est responsable de l'initialisation de l'objet ViewModel. .Il combinera un ou plusieurs services pour obtenir l'objet ViewModel du domaine métier, afin que l'interface de l'application atteigne un état utilisable au démarrage du chargement.
L'interface de mvc est étroitement liée à la logique et les données sont lues directement à partir de. la base de données. L'interface de mvvm est faiblement couplée au mode d'affichage et les données d'interface sont obtenues à partir du modèle de vue. Ainsi, Angularjs préfère mvvm
11.
Quels rôles jouent $scope, contrôleur, directive et service dans mvvm dans Angularjs ?
Si vous ne le savez pas, l'analyse de la première question est très claire, relisez-la attentivement
12. Dans angulaire Comment contrôlez-vous le chargement raisonnable des ressources statiques dans le projet
Réponse : Aucune
13. Que devez-vous payer. attention lors de l'écriture de la logique du contrôleur ?
Réponse :
1. Simplifiez le code (c'est ce que tous les développeurs doivent avoir)
2. Je ne peux absolument pas faire fonctionner le nœud dom À ce stade, vous pouvez vous demander pourquoi.
Votre réponse est : les opérations DOM ne peuvent apparaître que dans les directives. Le dernier endroit où il devrait apparaître est le service. Angular préconise le développement piloté par les tests. Si des opérations DOM apparaissent dans le service ou le contrôleur, cela signifie que le test ne peut pas réussir. Bien sûr, ce n'est qu'un point. Ce qui est important, c'est l'un des avantages de l'utilisation d'Angular, qui est la liaison de données bidirectionnelle, afin que vous puissiez vous concentrer sur le traitement de la logique métier sans avoir à gérer des piles d'opérations DOM. Si le code angulaire est encore plein de diverses opérations DOM, alors pourquoi ne pas utiliser jquery directement pour le développement.
Qu’est-ce que le développement piloté par les tests ? Pour le vulgariser :
le développement piloté par les tests, le nom anglais complet est Test-Driven Development, ou TDD en abrégé, est une nouvelle méthode de développement différente du processus de développement logiciel traditionnel. Cela nécessite d'écrire du code de test avant d'écrire le code d'une certaine fonction, puis d'écrire uniquement le code fonctionnel qui fait passer le test et de piloter l'ensemble du développement via les tests. Cela permet d'écrire du code concis, utilisable et de haute qualité et d'accélérer le processus de développement.
14.
Réponses sur la façon de communiquer entre les contrôleurs :
1.
Il existe deux méthodes pour les événements. L'une est scope.scope.scope.emit, puis obtient les paramètres en écoutant l'événement de root S cope ; rootScope pour obtenir les paramètres ; L'autre est l'événement de rootScope pour obtenir les paramètres ; l'autre est rootScope.broadcast, qui obtient les paramètres en écoutant la diffusion et en écoutant les événements de la portée.
Il n'y a aucune différence de performances entre ces deux méthodes dans la dernière version d'Angular. La raison principale est que la direction d'envoi des événements est différente. Vous pouvez choisir en fonction de la situation réelle.
2. Le service
peut créer un service d'événements dédié, ou il peut être divisé selon la logique métier et stocker les données dans le service correspondant.
3.
La méthode $rootScope est peut-être un peu sale, mais elle est plus pratique, c'est-à-dire. les données sont stockées dans le copeau racine S, de sorte que dans chaque sous-rootScope, donc dans chaque sous-rootScope, afin que chaque sous-scope puisse être appelé, mais vous devez faire attention au cycle de vie
4. Utiliser directement le scope . scope.scope.$nextSibling et propriétés similaires
.Semblable à scope .scope.scope.parent. Cette méthode présente plus d'inconvénients. Officiellement, il n'est pas recommandé d'utiliser des attributs commençant par $$, ce qui non seulement augmente le couplage, mais nécessite également de traiter des problèmes asynchrones, et l'ordre des portées n'est pas fixe.
Iln'est pas recommandé
de transmettre les paramètres via le stockage local, les variables globales ou postMessage dans les navigateurs modernes. Sauf circonstances particulières, veuillez éviter cette méthode.
15. Plusieurs paramètres des instructions personnalisées
.Réponse :
Parlons de quelques-uns couramment utilisés, tels que :
restrict : formulaire de déclaration de l'instruction dans dom E (élément) A (attribut) C (nom de classe) M (commentaire)
modèle : deux formulaires, Un type de texte HTML ; une fonction qui accepte deux paramètres, tElemetn et tAttrs, et renvoie une chaîne représentant le modèle. La chaîne du modèle doit avoir un élément racine DOM
templateUrl : deux formes, l'une est une chaîne représentant le chemin du fichier HTML externe ; une fonction qui peut accepter deux paramètres, les paramètres sont tElement et tAttrs, et renvoie les caractères du HTML externe. chemin du fichier
Compilation de chaîne (objet ou fonction) : L'option de compilation peut renvoyer un objet ou une fonction. Si la fonction de compilation est définie, cela signifie que nous voulons effectuer des opérations DOM avant que les instructions et les données en temps réel ne soient placées dans le DOM. Il est sûr d'effectuer des opérations DOM telles que l'ajout et la suppression de nœuds dans cette fonction. Essentiellement, lorsque nous définissons l'option de lien, nous créons en fait une fonction de lien postLink() afin que la fonction compile() puisse définir la fonction de lien.
Ensuite, il y a le portail : http://www.cnblogs.com/mliudong/p/4180680.html
La différence entre compiler et link :
lors de la compilation, compile convertit le dom, et l'enregistre d'abord lorsqu'il rencontre l'endroit où l'auditeur est lié. Plusieurs sont enregistrés, et enfin ils sont résumés dans une fonction de lien et exécutés ensemble, ce qui améliore les performances.
16. La réponse à la différence entre angulaire et jquery
:
angulaire est basé sur des données, donc angulaire convient aux projets avec des opérations de données compliquées (ici, vous pouvez mentionner à nouveau les applications d'une seule page, si vous ne savez pas comment faire les avantages sont là encore http://www.zhihu .com/question/20792064)
jquery est basé sur le pilote dom jquery convient aux projets avec de nombreuses opérations dom
17. Que savez-vous du formulaire form in
.angulaire ?
Réponse :
Angular a élargi le type d'éléments d'entrée et fournit un total des 10 types suivants :
texte
numéro
url
radio
case à cocher
bouton
caché
soumettre
réinitialiser
Angular a 4 styles CSS intégrés pour le formulaire.
ng-valid vérifie l'état légal
ng-invalid vérifie l'état illégal
ng-pristine Si vous souhaitez utiliser le formulaire natif, vous devez définir cette valeur
ng-dirty Le formulaire est dans l'état de données sales
Angular vérifiera le modèle lorsque
.vérifiant automatiquement le formulaire Si ng-model n'est pas défini, Angular ne peut pas savoir si la valeur de myForm.$invalid est vraie.
Le contenu requis pour la vérification
indique s'il faut saisir le contenu
ng-maxlength, longueur maximale
ng-minlength, longueur minimale
Exemple : Portail https://github.com/18500047564/clutter
18. Qu'est-ce que le filtre ?
Implémentez uneréponse
de filtre personnalisée
:date (date)
devise (devise)
limitTo (limiter la longueur d'un tableau ou d'une chaîne)
orderBy (tri)
minuscule (minuscule)
majuscule (majuscule)
nombre (formater un nombre, ajouter un séparateur de milliers et recevoir les paramètres limitent le nombre de points décimaux)
filter (traiter un tableau, filtrer les éléments contenant une certaine sous-chaîne)
json (formater l'objet json)
Il existe deux manières d'utiliser le filtre,
l'une est directement sur la page :
<p>{{now | date : 'aaaa-MM-jj'}}</p> L'autre est de l'utiliser en js :
$filter('filter name')(objet à filtrer, paramètre 1, paramètre 2,...)
$filter('date')(maintenant, 'aaaa-MM-jj hh:mm:ss'); Personnaliser un tableau de déduplication
app.filter("unique", function() {
fonction de retour (arr) {
var n = [];
var obj = {};
pour (var i = 0; i < arr.length; i++) {
si (!obj[arr[i]]) {
n.push(arr[i]);
obj[arr[i]] = 1;
}
}
retourner n ;
} ;
});