Le processus de fonctionnement de base des modèles et des données est le suivant :
L'utilisateur demande la page de démarrage de l'application
Le navigateur de l'utilisateur initie une connexion http au serveur, puis charge la page index.html, qui contient le modèle
Angular est chargé dans la page, attend que la page se charge et recherche la directive ng-app, qui est utilisée pour définir les limites du modèle
Angular parcourt le modèle pour trouver les relations spécifiées et de liaison, ce qui déclenchera une série d'actions : enregistrer les écouteurs, effectuer certaines opérations DOM et obtenir les données d'initialisation du serveur. Enfin, l'application démarrera et convertira le modèle en vue DOM
Connectez-vous au serveur pour charger d'autres données qui doivent être affichées à l'utilisateur
Afficher le texte
L'un utilise le formulaire {{}}, tel que {{greeting}} et le second ng-bind="greeting"
Utilisez la première méthode. Les pages non rendues peuvent être vues par les utilisateurs. Il est recommandé d'utiliser la deuxième méthode pour les pages d'index. Les pages restantes peuvent utiliser la première méthode
.Saisie du formulaire
Dans certains cas, nous ne voulons pas agir immédiatement dès qu’il y a un changement, mais nous devons attendre. Par exemple :
非表单提交型的交互,以cliquez为例
列表、表格以及其他迭代型元素
ng-repeat会通过$index返回当前引用的元素序号。 示例代码如下:
{{$index 1}} | {{student.name}} | {{student.score}} |
隐藏与显示
ng-show et ng-hide 功能是等价的,但是运行效果正好相反。
ng-class et ng-style peuvent accepter une expression. Le résultat de l'exécution de l'expression peut être l'une des valeurs suivantes :
Une chaîne représentant les noms de classes CSS, séparés par des espaces
tableau de noms de classe CSS
Mappage du nom de la classe CSS à la valeur booléenne
L'exemple de code est le suivant :
L'exemple de code est le suivant :