Simple parsing JSON using ANGULARJS

Source: Internet
Author: User

Use ANGULARJS+STRUTS2 for data interaction and display on the front and back tables.

Struts.xml

The configuration file needs to be set extends= "Json-default" type= "JSON"

 < Packagename= "Default"namespace="/"extends= "Json-default">        <Actionname= "Ajax"class= "com. Yiran583.action.ajacAction ">            <resulttype= "JSON"/>        </Action> </ Package>

Background code:

Set the appropriate Getter/setter method for properties that need to be passed to the foreground as JSON data

Privatelist<person> list =NewArraylist<person>(); Privateperson person ; @Override PublicString Execute ()throwsException {//TODO auto-generated Method Stub Person Person=NewPerson ("Yiran", 20); Person Person1=NewPerson ("jiao", 22); Person Person2=NewPerson ("Zhangsan", 18);        List.add (Person1);        List.add (Person2); List=jsonarray.fromobject (list); returnSUCCESS; }     PublicList<person>getList () {returnlist; }     Public voidSetlist (list<person>list) {         This. List =list; }

Front desk:

Ng-repeat Loop Display

X.name,x.age is a property in a JSON object, respectively

$scope. name = A.list; Binds the result returned by the list object to name

<BodyNg-app>    <spanID= "BTN"style= "cursor:pointer; font-size:20px">Action</span>    <DivID= "Rdiv"Ng-controller= "MYCC">area to display data from<Ling-repeat= "x in Names">{{x.name+ "" +x.age}}</Li>    </Div>    <Scripttype= "Text/javascript">        functionMYCC ($scope, $http) {varURL= "ajax.action"; $http. Get (URL). Success (function(a) {$scope. Names=a.list;        }); }    </Script></Body>

  

Simple parsing JSON using ANGULARJS

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.