How to get the array value and in structurized usi

2019-05-31 11:25发布

站内问答 / 后端开发
1309 2 5

I am using MeanStack AngularJS. I stored the values into MongoDB like this:

Data format

"RoleName" : "Verify",    
"IsActive" : true,
"UIList" : 
    {
        "UiName": "One",
        "View" : false,
        "Edit" : false
    },
    {
       "UiName": "Two",
        "View" : false,
        "Edit" : false
    },
    {
        "UiName": "Three",
        "View" : false,
        "Edit" : false
    },
    {
        "UiName": "Four",
        "View" : false,
        "Edit" : false
    },
    {
        "UiName": "Five",
        "View" : false,
        "Edit" : false
    }

Contoller

$http.get('/Manage_Datashow').success(function (response) {
    $scope.Manage_Roleser = response;
});

Server

app.get('/Manage_Datashow', function (req, res) {
    db.New_Role.find(function (err, docs) {
        console.log(docs);
        res.json(docs);
    });
});

Here I attached my sample code. I want to bind the values in list using ng-repeat.

My code:

<ul ng-repeat=Manage_Rolese in Manage_Roleser >
  <li>{{Manage_Rolese.UIList.UiName}}</li>
  <li>{{Manage_Rolese.UIList.View}}</li>
  <li>{{Manage_Rolese.UIList.Edit}}</li>
</ul>

Example:

enter image description here

I need output like this.

2条回答
等我变得足够好
2楼-- · 2019-05-31 12:03

Try this

<html>
<body>
	<div Class="container" ng-app="myapp" ng-controller="namesctrl">
		
		<table>
			<thead>
				<th>
					UiName
				</th>
				<th>
					View
				</th>
				<th>
					Edit
				</th>
			</thead>
			<tr ng-repeat="mgr in Manage_Roleser.UIList">
				<td>
					{{mgr.UiName}}
				</td>
				<td>
				|{{mgr.View}}
				</td>
				<td>
					{{mgr.View}}
				</td>
			</tr>
		</table>
	</div>  


	<script Src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.1/angular.js"></script>

	<script>
		var app=angular.module("myapp", []);
		app.controller("namesctrl", function($scope){

			$scope.Manage_Roleser= 
			{
				"RoleName" : "Verify",    
    			"IsActive" : true,
				"UIList": [{
				"UiName": "One",
				"View" : false,
				"Edit" : false
			},{
				"UiName": "Two",
				"View" : false,
				"Edit" : false
			},
			{
				"UiName": "Three",
				"View" : false,
				"Edit" : false
			},
			{
				"UiName": "Four",
				"View" : false,
				"Edit" : false
			},
			{
				"UiName": "Five",
				"View" : false,
				"Edit" : false
			}]
		}
			

		});



	</script>
</body>
</html>

查看更多
0人赞 添加讨论(0) 举报
闹够了就滚
3楼-- · 2019-05-31 12:07

First off all you json is not a valid one please check that and go through the below snippest 

var app = angular.module('plunker', []);

app.controller('MainCtrl', function($scope) {
  $scope.Manage_Roleser =[ {
    "RoleName" : "Verify",    
    "IsActive" : true,
    "UIList" : [{
            "UiName": "One",
            "View" : false,
            "Edit" : false
        },
        {
           "UiName": "Two",
            "View" : false,
            "Edit" : false
        },
          {
            "UiName": "Three",
            "View" : false,
            "Edit" : false
        },
         {
            "UiName": "Four",
            "View" : false,
            "Edit" : false
        },
          {
            "UiName": "Five",
            "View" : false,
            "Edit" : false
        }]
       } ]
});
<!DOCTYPE html>
<html ng-app="plunker">

  <head>
    <meta charset="utf-8" />
    <title>AngularJS Plunker</title>
    <script>document.write('<base href="' + document.location + '" />');</script>
    <link rel="stylesheet" href="style.css" />
    <script data-require="angular.js@1.4.x" src="https://code.angularjs.org/1.4.12/angular.js" data-semver="1.4.9"></script>
    <script src="app.js"></script>
  </head>

  <body ng-controller="MainCtrl">
 
 <div>
  
     <div  ng-repeat="i in Manage_Roleser[0].UIList">
       {{i.UiName}} | {{i.View}}   {{i.Edit}}
      
       
     </div>
   
 </div>
  </body>

</html>
Add your headings like as you want.

查看更多
0人赞 添加讨论(0) 举报
登录 后发表回答
相关问题
查看全部
相关文章
查看全部
收藏的人(5)