The ANGULARJS directive is an extended HTML attribute with a prefix ng-. The ng-app instruction Initializes a ANGULARJS application. The ng-init instruction initializes the application data. The Ng-model directive binds application data to HTML elements.
Angularjs The basic Instructions for learning notes (init, repea
Contact, learning Angularjs has been three months, with the deepening of learning, some things just start not understand, now began to slowly understand. So, began to organize these months of study results. Or forget about it again ...Beginner angular, is to see Mu class nets desert poor autumn teacher taught gramming, the following is a reference to the tutori
Here are the notes from the learning process, some of which are online excerptsDOCTYPE HTML>HtmlLang= "ZH-CN">Head>MetaCharSet= "UTF-8">Title>bootstrap-autoTitle>StyleType= "Text/css">. Ng-cloak{Display:None;}Style>Head>Body>div ng-app class= " Ng-cloak ">{{2+3*2}}div> script src= ". /angular.js " Type=" Text/javascript ">script> body>> Inside the "Ng-cloak", this is used before the Angular.js compilation is completed (right!) That's right!
Angularjs introduced a lot of new concepts, it is necessary to understand the general concepts before learning
Template
Template--html Templates
Directive
Directives--Custom attributes or HTML elements to extend HTML
Model
Model-the data that the user sees and interacts with in the view
Scope
The scope--model stored environment,
Today, let's take a look at the routing module in angular. In our actual project, the switching of each page is often related to auth. For example, the background of my site, is required to login to the user to go in, then we use ANGULARJS to do the front-end routing should be how to complete this function?------------------------------------------------------------------------Let's start by imagining the simplest scenario. Our application has two pag
Many problems occurred during karma startup: 1. to install karma, you must first install nodejs and npm before installing karma. for the installation process of nodejs and npm, refer to the article: Angularjs learning --- establish the angularjs environment, and install nodejs, npm, and karma 2 under ubuntu 12.04. install karma step karma official tutorial 1 ). r
1.HTML control: The following HTML INPUT element is called an HTML control:**input elements**select elements**button elements**textarea elements2.AngularJS Form instances:novalidate>//novalidate property is New in HTML5, disables default validation using the browserFirst name: Last name: Angularjs Learning Form
;
When this usage means that variable is true, add red to the element, and if variable is false, add the class green, which is a good use when the logic is relatively simple.The next appropriate time to add multiple classes, that is, the value of Ng-class is an object
png-class="{strike:deleted,bold:important,red:error}">MapSyntaxExamplep>inputtype="checkbox"ng-model="deleted">deleted(apply"strike"class)br>inputtype="checkbox"ng-model="important">important(apply"bold"clas
There are a number of issues with Karma Startup:1. Installation Karma PrerequisitesInstall Karma First to install NODEJS,NPM before you can install the KARMA.NODEJS,NPM installation process can refer to the article: ANGULARJS Learning---ANGULARJS environment construction, Ubuntu 12.04 installation of Nodejs, NPM and Karma2. Installing Karma stepsKarma Official Gu
Good memory is better than bad writing ... As a note, the first to start from anchor Scroll, a cup of coffee time can be read, long do not see:)
$anchorScroll () to jump to the definition ID;
The hash () method of the $location object replaces the current URL as a hash key;
$anchorScroll () reads and jumps to the ID.
In the following simple example, here is the output:Source index.html--11 line, marked with the Jump ID:1 DOCTYPE HTML>2 HTMLNg-app= "App">3 Head>4 Scriptsrc
The angular event system does not communicate with the browser's event system, which means that we can only listen for angular events instead of DOM events at the scope. Angular event propagation: On a nested controller scope chain , it is possible to propagate down ($broadcast) and propagate up ($emit). The value assigned by $broadcast can only be obtained by the child, and $emit assigned value can only be obtained by the parent, and nothing at the level can be obtained.
scope, the page can be displayed, such as
myModule.controller(‘DetailController‘,function($scope,$stateParams){console.log($stateParams);$http.post(‘API_URL‘,{params:$stateParams}).success(function(data,status,headers,config){$scope.content=data;});})
We send the $stateparams to the background through the HTTP service, and then bind the returned data to the $scope.content, and the {{content}} in detail.html can be changed?----------------------------------------------------
1: First say the command domain scope @I think the description is very laborious, directly in the code to illustrate:Angularjs.htmlMain05.jsvar myapp=angular.module (' myApp ', []); Myapp.controller (' Listctrl ', function ($scope) { $scope. logchore= " Motorola ";}); Myapp.directive (' Kid ', function () {return {' Restrict ': ' E ', Scope:{title: "@"},template: ' Entering a number in the input box is bound to the title of the directive template.2: Say more about scope = angularjs.htmlThe Ma
In fact, a relatively hindsight knowledge, with the NG basis to see this will have a deeper understanding, but not suitable for getting started.The AngularJS application consists of the following:View, which is HTML.Model (models), the data available in the current view.Controller, the JavaScript function, can add or modify properties.Scope is a model and a link between view and controller.It's all annotated with//. Because you can't use shortcut keys
Let's talk about the path to programming language learning and the path to programming language.
This article is a summary of the path to learning your programming language (still in progress), because you have also stepped on many pitfalls ", I hope to help some later p
The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion;
products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the
content of the page makes you feel confusing, please write us an email, we will handle the problem
within 5 days after receiving your email.
If you find any instances of plagiarism from the community, please send an email to:
info-contact@alibabacloud.com
and provide relevant evidence. A staff member will contact you within 5 working days.