{"id":18447576,"url":"https://github.com/eliooooooo/start-angularjs","last_synced_at":"2026-05-11T05:35:03.083Z","repository":{"id":214636095,"uuid":"736985817","full_name":"eliooooooo/start-angularjs","owner":"eliooooooo","description":"My basic Angular documentation. From my AngularJs basics course","archived":false,"fork":false,"pushed_at":"2023-12-31T15:49:28.000Z","size":621,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-04-15T17:15:35.032Z","etag":null,"topics":["angularjs","documentation"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/eliooooooo.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2023-12-29T13:06:54.000Z","updated_at":"2024-03-11T14:48:35.000Z","dependencies_parsed_at":null,"dependency_job_id":"4710cc22-0364-4ade-9b0c-d2a0645d8a9f","html_url":"https://github.com/eliooooooo/start-angularjs","commit_stats":null,"previous_names":["eliooooooo/start-angularjs"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/eliooooooo/start-angularjs","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/eliooooooo%2Fstart-angularjs","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/eliooooooo%2Fstart-angularjs/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/eliooooooo%2Fstart-angularjs/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/eliooooooo%2Fstart-angularjs/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/eliooooooo","download_url":"https://codeload.github.com/eliooooooo/start-angularjs/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/eliooooooo%2Fstart-angularjs/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":32883461,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-10T13:40:02.631Z","status":"online","status_checked_at":"2026-05-11T02:00:05.975Z","response_time":120,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["angularjs","documentation"],"created_at":"2024-11-06T07:13:49.793Z","updated_at":"2026-05-11T05:35:03.067Z","avatar_url":"https://github.com/eliooooooo.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# AngularJS Tutorial\n## Installation \n\nPour installer AngularJS, vous pouvez utiliser le gestionnaire de paquets npm. Exécutez la commande suivante dans votre terminal :  \n```bash\nnpm install angular\n```\n\n## Ng-app\n\n`ng-app` est une directive qui initialise une application AngularJS. Elle définit le domaine d'application.  \n```html\n\u003cbody ng-app=\"myApp\"\u003e\n```\n\n## Ng-init\n\n`ng-init` initialise les données de l'application AngularJS (permet de créer des variables dans le html directement)  \n```html\n\u003cdiv ng-init=\"numbers=[0, 1, 2, 3, 4, 5, 6, 7, 8, 9]\"\u003e\n```\n\n## Ng-bind\n\n`ng-bind` remplace le contenu d'un élément HTML (innerHTML) par la valeur d'une variable donnée.\n```html\n\u003cp ng-bind=\"name\"\u003e\n```\n\n## Ng-repeat\n\n`ng-repeat` répète un élément HTML pour chaque élément d'un tableau ou d'un objet (for).\n```html\n\u003cli ng-repeat=\"name in names\"\u003e{{ name }}\u003c/li\u003e\n```\n\n## Ng-show / Ng-hide\n\n`ng-show` et `ng-hide` sont des directives qui affichent ou cachent un élément HTML en fonction de la valeur d'une expression ou d'une variable.\n```html\n\u003cp ng-show=\"show\"\u003eShow me !\u003c/p\u003e\n\u003cp ng-hide=\"hide\"\u003eHide me !\u003c/p\u003e\n```\n\n## Ng-controller\n\n`ng-controller` est une directive qui ajoute un contrôleur à votre application. Le contrôleur est où vous définissez l'état et le comportement de l'application.\n```html\n\u003cdiv ng-controller=\"myCtrl\"\u003e\n```\n\n## Ng-click\n\n`ng-click` est une directive qui vous permet d'exécuter une expression ou une fonction lorsque l'élément est cliqué.\n```html\n\u003cbutton ng-click=\"count = count + 1\"\u003eClick me !\u003c/button\u003e\n```\n\n## Ng-model (in form)\n\n`ng-model` est une directive qui lie la valeur d'une entrée HTML à une propriété sur le scope. C'est essentiel pour la liaison bidirectionnelle des données.\n\n```html\n\u003cinput type=\"text\" ng-model=\"name\"\u003e\n```\n\n## Ng-submit\n\n`ng-submit` est une directive qui permet d'éxecuter une expression ou une fonction lorsque le formulaire est soumis\n```html\n\u003cform ng-submit=\"submitForm()\"\u003e\n```\n\n## Ng-valid / Ng-invalid\n\n`ng-valid` et `ng-invalid` sont des classes en CSS qui sont ajoutées automatiquement par AngularJS en fonction de la validité des champs de votre formulaire\n\n## Ng-pristine / Ng-dirty\n\n`ng-pristine` et `ng-dirty` sont des classes CSS qui sont ajoutées automatiquement par AngularJS. `ng-pristine` est ajouté si le champ n'a pas été modifié, `ng-dirty` si le champ à été modifié.\n\n## Ng-include\n\n`ng-include` est une directive qui permet d'inclure du contenu HTML externa dans votre vue.\n```html\n\u003cdiv ng-include=\"'mytemplate.html'\"\u003e\u003c/div\u003e\n```\n\n## Concaténation \n\nEn AngularJS, vous pouvez concaténer des chaînes de caractères en utilisant l'opérateur `+`.\n```javascript\n$scope.fullName = $scope.firstname + \" \" + $scope.lastname;\n```\n\n## Contrôleur\n\nEn AngularJS, un contrôleur est une fonction JavaScript qui ajoute des données et des fonctions supplémentaires à $scope.\n```javascript\napp.controller('myCtrl', function($scope) {\n  $scope.firstname = \"Eliott\";\n  $scope.lastname = \"BURKLE\";\n});\n```\n\n## Object Scope\n\nL'object `$scope` est l'application du modèle MVC (Model_View-Controller). Il relie le contrôleur et la vue. Les données du modèle sont stockées dans l'objet `$scope`.\n```javascript\napp.controller('myCtrl', function($scope) {\n  $scope.firstname = \"Eliott\";\n  $scope.lastname = \"BURKLE\";\n});\n```\n\n## Filters\n\nLes filtres en AngularJS permettent de formater les données pour l'affichage à l'utilisateur. Ils peuvent être utilisés dans les directives, les vues, les contrôleurs ou les services. AngularJS fournit un ensemble de filtres intégrés, mais vous pouvez également créer vos propres filtres.\n\nVoici quelques filtres intégrés :\n\n- `uppercase` : transforme le texte en majuscules.\n- `lowercase` : transforme le texte en minuscules.\n- `currency` : formate un nombre en devise.\n- `limitTo` : limite un tableau ou une chaîne à une longueur spécifique.\n- `orderBy` : trie un tableau par un critère spécifique.\n\nExemple d'utilisation d'un filtre dans une directive :\n\n```html\n\u003cp\u003e{{ name | uppercase }}\u003c/p\u003e\n```\n\n## Submitting forms\n\nPour soumettre un formulaire en AngularJS, vous pouvez utiliser la directive `ng-submit` comme mentionné ci-dessus. Vous pouvez également utiliser `ng-click` sur le boutton de soumission.\n\n## Valid attribute\n\nLa validation des formulaires en AngularJS peut être effectuée en utilisant des attributs HTML tels que `required`, `min`, `max`, `pattern`, etc.\n\n## Form validation\n\nAngularJS fournit une validation de formulaire puissante et flexible. Vous pouvez utiliser des attributs HTML pour la validation, et AngularJS ajoutera automatiquement certaines classes CSS pour vous aider à styliser les éléments valides et invalides.\n\n## Custom directives \n\nLes directives personnalisées vous permettent de créer vos propres directives, par exemple :\n```javascript\napp.directive('myDirective', function() {\n  return {\n    template: '\u003ch1\u003eCustom directive!\u003c/h1\u003e'\n  };\n});\n```\n\n## Dependencies\n\nLes dépendances en AngularJS sont gérées par l'injection de dépendances. Vous pouvez ajouter des dépendances à votre module en les ajoutant dans la liste des  dépendances lors de la création du module, ou à votre contrôleur en les ajoutant à la fonction du contrôleur.\n```javascript\nlet app = angular.module('myApp', ['ngRoute']); // Ajout de ngRoute comme dépendance du module\n\napp.controller('myCtrl', ['$scope', '$http', function($scope, $http) { // Ajout de $http comme dépendance du contrôleur\n  // ...\n}]);\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Feliooooooo%2Fstart-angularjs","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Feliooooooo%2Fstart-angularjs","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Feliooooooo%2Fstart-angularjs/lists"}