Question

我试着看这样的事情：

/big_big_package
/door 
   /cooler
   /chair

html：

<div ng-repeat="i in split">
    <div ng-repeat="s in i">
        <a ng-click="Paths(s)" style="cursor:pointer;" class="left-menu-link">
            {{s}}
        </a>
    </div>
</div>

JSON：

[
    "/big_big_package", 
    "/door/cooler", 
    "/door/chair", 
    "/door"
]

Plunker：http://plnkr.co/edit/g1t4pludTTIAJYKTToCK?p=preview

Answer 1

我试过你的问题。这是我的方法，

对数组进行排序，以便我们按顺序获取文件夹结构。
循环访问数组，同时检查当前元素中是否包含前面的元素。
如果找到元素，则添加填充。

请检查我的Plunkr我的方法的GIST。这只是一个基本的例子，它可以在一个层次上运行，但你需要调整这个函数才能在多层次上工作。

Plunkr Demo

<强> JS：

<li ng-repeat="i in id">
      <a ng-style="{ 'padding-left' : i.padding}" ng-click="Paths(i)" style="cursor:pointer;" class="left-menu-link">
          {{i.value}}
      </a>
  </li>

<强> HTML：

public List<String> findPrices(String product){
    List<CompletableFuture<String>> priceFutures =
    shops.stream()
         .map(shop -> CompletableFuture.supplyAsync(
                () -> shop.getPrice(product), executor))
         .map(future -> future.thenApply(Quote::parse))
         .map(future -> future.thenCompose(quote ->
                CompletableFuture.supplyAsync(
                        () -> Discount.applyDiscount(quote), executor
                )))
         .collect(toList());

    return priceFutures.stream()
                       .map(CompletableFuture::join)
                       .collect(toList());
}

Answer 2

一种方法可以是将字符串拆分为/，然后为那些只有一个条目的项目构建一个树，其中包含所有具有两个（或更多）条目的项目，并且第一个条目匹配。最后删除放在树中的项目：

var tree = data.data.map(function(d) {
  return d.split('/').slice(1)
})
tree.forEach(function(t) {
  if (t.length == 1) t.tree = tree.filter(function(f) {
    if (f != t && f[0] == t[0]) {
      f.processed = true;
      f.shift();
      return f
    }
  })
})
tree = tree.filter(function(t) {
  if (!t.processed) return t
})
$scope.id = tree;

使树状缩进使用嵌套的<ul>＆＃39;

<ul>
 <li ng-repeat="i in id">
   {{ i[0] }}
   <ul ng-if="i.tree">
     <li ng-repeat="t in i.tree">
       {{ t[0] }}
     </li>
   </ul>
  </li>
</ul>

更新了plunkr http://plnkr.co/edit/NDLqM7Yo2w9oJUsmxi37?p=preview

树视图过滤表AngularJS

2 个答案: