I have only just started to contact angularjs. I used to work on java backend. Now I am in charge of app development and need to learn some front-end knowledge. Now I will learn according to the book "Developing Next-Generation Web Applications with Angularjs". It also provides some learning materials, ionic Chinese online documentation: http://www.ionic.wang/js_doc-index-id-6.html , which also contains learning materials for introducing and learning the combination of ionic and angularjs. In short, angularjs assists front-end development. Of course, you can also learn react.js and vue.js, which can be developed accordingly. If you haven’t touched it yet, just follow some of the angularjs you have learned so far.
Chapter 1: Introduction to Angularjs
Mainly said the basic features of angularjs:
- MVC: Core concept: code that manages data (model), application logic code (controller), and code that displays data to users (view) are clearly separated.
- data binding
- Dependency injection: $scope, $location
- instruction:
ng-app: tells which part of the angularjs page needs to be managed by it, equivalent to the main method of java, a single page html can only appear once
ng-controller: is a controller with a js
ng-repeat: for list
{{}}: data binding, generally use $scope for data binding
ng-click: click event
Chapter 2: AngularJS Application Skeleton
index.html This page contains all templates
ng-bind display text
$scope context $index element number ng-repeat list display
The $first $middle $last ng-repeat directive returns a boolean value
ng-show ng-hide show and hide
ng-class ng-style css 样式
ng-src ng-href for <img> and <a> tags
ng-controller controller
The model parameters specified on ng-model ng-model also work in the outer controller to establish two-way binding.
What the controller exists for: When the user interacts with the view, it is responsible for providing code or logic to execute the user's thoughts. It is recommended to create a controller for each functional area in the view. The $scope on the parent controller object is passed to the $scope of the inner nested controller.
template : view
$watch('string', function/expression, true/false) monitor data model changes
$location ng-view tells angularjs where to display the view