1
如果描述值爲空,則應將該值創建爲「根文檔並放置到列表頂部。如何使用Angularjs創建樹結構的HTML模板
如果描述值不爲空值應爲文件夾名稱和標題創建要創建爲「文件夾名稱」
的根文件如果描述值等於在JSON數據的其他說明價值,他們值不應創建爲僅爲匹配描述值(文件夾名稱)的根文檔創建的文件夾名稱。
如果說明值是(1> 2),那麼應該將「two」創建爲「one」的子文件夾,並且應將「title」值創建爲子文件夾的根文檔(兩個)。
HTML:
<div ng-controller="TodoCrtl">
<ul>
<li ng-repeat="description in getDescriptions()" style="color:red;">
{{description}}
<ul>
<li ng-repeat="bookmark in flaternedBookmarks|filter:{description:description}" style="color:blue;">
{{bookmark.title}}
</li>
</ul>
</li>
</ul>
</div>
JS文件:
function TodoCrtl($scope) {
$scope.names = [{
"description": "Testing File",
"totalCount": 6,
"bookmarks":
[
{
"title": "Google",
"description": "Health Care",
},
{
"title": "Test Construction1",
"description": "",
},
{
"title": "one 1.1",
"description": "one",
},
{
"title": "one 1.2",
"description": "one",
},
{
"title": "Test Connection",
"description": "Education",
} ,
{
"title": "Project EA TEST 1",
"description": "",
},
{
"title": "one 2.1",
"description": "one > two",
},
{
"title": "one 2.2",
"description": "one > two",
}
]
}];
$scope.getDescriptions=function(){
var descriptions=[];
$scope.flaternedBookmarks=[];
var arr= $scope.names;
angular.forEach(arr,function(ai){
angular.forEach(ai.bookmarks,function(v){
if(v.description.trim()==='')
{
descriptions.splice(0,0,v.title.trim());
}else
{
descriptions.splice(descriptions.length-1,0,v.description.trim());
}
$scope.flaternedBookmarks.push(v);
});
});
return descriptions.filter (function (v, i, a) { return a.indexOf (v) == i; });
};
現在的問題是空的UI在「根文件以及如何創建添加的。如果描述值邏輯(1> 2)應該創建爲「two」的子文件夾,並且應該在此腳本中創建「title」值作爲子文件夾的根文檔(兩個)。
所有根文檔中使用相同的類和所有的文件夾和子文件夾使用同一類
我嘗試沒有任何插件 – CodeMan