The role of ANGULARJS controller controllers

Source: Internet
Author: User

We give the Model a parameter name in view to assign the value "Hello World".

This is a simple assignment, and we can implement a simple assignment in the view through the NG instruction (the instruction beginning with ng-), and if a complex logical operation is encountered, the view is not able to perform complex operations, then the controller comes in handy.

Simply put: Controller controllers are a series of operations that implement data transfer between views and models, method calls, and change models, which is a JavaScript function (which can also be considered a class or type)

The controller has several points to note:

1. A controller is best to include only one view of the business logic. Later you'll see our directory structure Client/scripts/controllers contains a number of controller scripts.

2. There is no mutual invocation between the controllers, a common tool method and a business that is not part of the controller are extracted separately to make a service, and then injected into the controller to invoke the service. For example, the request server to get the data should be made service alone, after all, some data is shared by many controllers.

3. The controller should not operate the DOM.

4. Data filtering should not be done in the controller because the Angular.js has a powerful filter filter.

Below we write a simplest controller in the index.html page Myctrl

The script is as follows:

<script type= "Text/javascript" >var myApp = Angular.module ("Yijiebuyi", []). Controller ("Myctrl", function ($scope) {$scope. Name = ' a commoner ';}); </script>

First see this controller monitoring application name "Yijiebuyi", Ng-app can be regarded as an application of Angular.js portal.

Through this portal we created a simple controller "Myctrl" then you see an object $scope, this thing we will open a separate blog to explain, here you think of it as a context.

It is very important to connect models and views. We give the $scope object property name assignment "A cloth commoner", then how to access it in the view?

<div ng-controller= "Myctrl" > Display text, <span ng-bind= "name" ></span></div>

We have the Angular.js directive identity Ng-controller in the view, which specifies the controller name "Myctrl", and this controller we have implemented the script on the current page.

The span label binds the value of the Name property in the model through Ng-bind.

Through the above controller we can see that the Name property of $scope has been assigned a "one-piece cloth", we run the page to see the effect.

You can see that the assignment to the model Name property in the controller has been successfully displayed in the view.

The role of ANGULARJS controller controllers

Contact Us

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.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.