Home > Developer > Web Develop
Ng-app the root element of the angular, starting from here to compile the DOM
Ng-model declares the variable and binds the value of the element to the variable
Traverse Ng-repeat
Generally used in lists and drop-down menus
<div ng-app= "" ng-init= "names=[' Jani ', ' hege ', ' Kai ']" > <p> use ng-repeat to loop arrays </p> <ul > <li ng-repeat= "x in Names" > {{x}} </li> </ul></div>Custom directives
Looks like angular is a global variable.
<body> <div ng-app= "App" > <!--call Method 1-- <say-hello></say-hello> </div> <script> // get to App instance var app = Angular.module ("app" ,[]); // add say Directive App.directive ("SayHello", () ={ return { // Be sure to template, directly return the string does not Template: " }; }); </script> </body>Controller controllers, which write the business logic of the page
Variable name must hump, otherwise it will parse the wrong
In fact, the IDE also error.
Many pits, if there are some places leaking, the entire template will not work.
<body> <!--Here you must specify the controller name to use--<div ng-app= "app" ng-controller= "Myctrl" > <!--&L t;input> tag represents input box--<input type= "text" ng-model= "FirstName" ><br> <input type= "text" ng- Model= "LastName" ><br> <!--can not be directly used with variable FullName, because there is no way to declare directly, only functions---<div>{{fullName ()}}</div> </div> <script>varApp = Angular.module (' app ',[]); App.controller (' Myctrl ', ($scope) ={$scope. firstName= "Hello"; $scope. LastName= "World"; //declare the function, take care not to add ()$scope. FullName = () ={ return$scope. firstname+ "" +$scope. LastName; } }); </script></body>
Controllers in external files
And JS, must be separate files to write, just need to introduce JS in the script tag, the other way of writing/use the same
<script src= "Personcontroller.js" ></script>
Scope scope
Scope is a JavaScript object with properties and methods that can be used in views and controllers
1, in the controller, as a parameter, the above is an example.
2, the controller to scope to add objects, view can get. Use no $scope prefix required
3, in view use Ng-model to add objects to scope, controller can get. $scope prefix required for controller use
Root scope
is the scope bridge within each controller.
When iterating through an array, a constant is required. Of course, you can also use constants directly
<ul> <li ng-repeat= "x in Names" >{{x}} {{lastname}}</li></ul>App.controller ( function ($scope, $rootScope) { = ["Emil", "Tobias", "Linus"]; = "Refsnes";});ANGULARJS Learning 2-instruction (Directive)/Controller/scope (SCOPE)
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
