我在我的应用程序中使用MEAN堆栈,将AngularJS作为我的前端。如何在重复的回答中删除Square Brackets []
和Double quotes ""
,My plunker实际上我们需要在我的应用中显示role
个值,以便我们使用ng-repeat="mani in name.comments "
来获得答案,我们得到了["user"]
,["admin"]
,["kp"]
这样的答案,我们只需要单独显示值,而不是[] Square Brackets
和{{1 }} .... 例如答案: - Double quotes
中的值和[] Square Brackets
中的值Double quotes
我的数据:
1. user , 2. admin, 3. kp
我的Html: -
$scope.name = {
"_id": "5863d3aaacaeddc00663bc07",
"comments": [
{
"created": 1485511936350,
"role": [
"user"
],
"email": "selvam@e21designs.com",
"name": "selvam R",
"commentText": "mani selvam"
},
{
"created": 1485511936350,
"role": [
"admin"
],
"email": "selvam@e21designs.com",
"name": "selvam R",
"commentText": "mani selvam"
},
{
"created": 1485511936350,
"role": [
"kp"
],
"email": "selvam@e21designs.com",
"name": "selvam R",
"commentText": "mani selvam"
}
],
"created": "2016-12-28T15:00:58.777Z",
"isCurrentUserOwner": false
};
请查看My plunker以供参考......
期待答案没有<div ng-repeat="mani in name.comments ">
<td>{{$index + 1}}</td>
<td>{{mani.role }}</td>
</div>
和[] Square Brackets
...
此Double quotes
位于数组中,因此仅显示role
和[] Square Brackets
,因此我们如何删除它,我们只需显示值...我们尝试了许多方法,我们知道这是一项简单的任务,但我们无法解决这个问题。
我们可以使用css删除吗?...任何人都知道解决方案请帮助我们...谢谢
请更新plunker以了解确切的解决方案....
答案 0 :(得分:5)
您只需要使用以下命令在索引0处选择数组的第一个元素:
{{ mani.role[0] }}
var app = angular.module('plunker', []);
app.controller('MainCtrl', function($scope) {
$scope.name = {
"_id": "5863d3aaacaeddc00663bc07",
"comments": [{
"created": 1485511936350,
"role": [
"user"
],
"email": "selvam@e21designs.com",
"name": "selvam R",
"commentText": "mani selvam"
}, {
"created": 1485511936350,
"role": [
"admin"
],
"email": "selvam@e21designs.com",
"name": "selvam R",
"commentText": "mani selvam"
}, {
"created": 1485511936350,
"role": [
"kp"
],
"email": "selvam@e21designs.com",
"name": "selvam R",
"commentText": "mani selvam"
}],
"created": "2016-12-28T15:00:58.777Z",
"isCurrentUserOwner": false
};
});
&#13;
<!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.5.x" src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.10/angular.min.js" data-semver="1.5.10"></script>
<script src="app.js"></script>
</head>
<body ng-controller="MainCtrl">
<div ng-repeat="mani in name.comments ">
<td>{{$index + 1}}</td>
<td>{{ mani.role[0] }}</td>
</div>
</body>
</html>
&#13;
答案 1 :(得分:5)
您可以使用toString()
方法将正在显示的数组转换为字符串。像这样:
<td>{{mani.role.toString()}}</td>
这会将其显示为字符串,以便删除"
和[]
。
答案 2 :(得分:0)
您的mani.role
是一个数组,所以请执行以下操作:
<td><span ng-repeat="r in mani.role">{{ r }} </span></td>
答案 3 :(得分:0)
您的数据看起来像Json数据,所以您需要的是通过创建这样的模块来通过AngularJS读取Json数据:
var App = angular.module('App', []);
App.controller('Ctrl', function($scope, $http) {
$http.get('data.json')
.then(function(res){
$scope.data = res.data;
});
});
此外,w3schools对您的案例有用$http in AngularJS