Question

我需要使用angularjs ui-router为分层类别建立一个url结构。

实施例

类别树如下所示：

根
- 申请1
- 类别1
---类别2级
----类别3级
- 申请2
- 申请3

网址 xyz.com/application-1/category-1 将显示类别级别1的文章，类似地 xyz.com/application -1 / category-1 / category-2 / category-3 将显示类别级别3的文章。这可以达到4或5级别的类别。

根据我的理解，我将必须为每个类别级别定义状态，并且所有这些状态都可以访问相同的模板和控制器。是否有更好，更智能的方式来实施这些状态？

Answer 1

如何使用angular ui-router和抽象路由？......类似于：

System.DirectoryServices.DirectorySearcher mySearcher = new DirectorySearcher(mySearchRoot, myFilter, myPropertiesList);
System.DirectoryServices.SearchResultCollection myResults = mySearcher.FindAll();
foreach (System.DirectoryServices.SearchResult result in myResults)
{
   var propertyNames = result.Properties.PropertyNames.Cast<String>().ToList<String>();
   if (!propertyNames.Contains("proxyaddresses")) 
   {
      // This property does not exist. Abort.
      continue;
   }
   List<string> proxyAddresses = result.Properties["proxyaddresses"].Cast<String>().ToList();
   // Do something with proxyAddresses
}

因此标记为abastract的索引路由是多个子

的“父亲”

Answer 2

将stateProvider与嵌套状态和视图https://github.com/angular-ui/ui-router/wiki/Multiple-Named-Views

一起使用

$stateProvider.state('/home', {
     url: '/home',
     templateUrl: '',
     controller: ''
})
.state('home.app1', {
     url: '/home/app1',
     templateUrl: '',
     controller: ''
})
.state('home.app1.cat1', {
     url: '/home/app1/cat1',
     templateUrl: '',
     controller: ''
})
.state('home.app1.cat1.cat2', {
     url: '/home/app1/cat1/cat2',
     templateUrl: '',
     controller: ''
})
.state('home.app1.cat1.cat2.cat3', {
     url: '/home/app1/cat1/cat2/cat3',
     templateUrl: '',
     controller: ''
})
.state('home.app2', {
     url: '/home/app2',
     templateUrl: '',
     controller: ''
})
.state('home.app3', {
     url: '/home/app3',
     templateUrl: '',
     controller: ''
})
$routerUrlProvider.otherwise('/home'); // if no path matched

我没有提到命名视图。你可以通过链接，它可以帮助很多。

但上述情况构成了重组国家。因此，您需要在单个状态下显示相关信息。例如，如果有三个类别，并且您希望在单个页面中显示，那么您可以定义这样的状态。

.state('home.app1',{
   url: '/home/app1',
   views: {
    "view1": {
      templateUrl: 'cat1.html',
      controller: ''
    },
    "view2": {
      templateUrl: 'cat2.html',
      controller: ''
    },
    "view3": {
      templateUrl: 'cat3.gtml',
      controller: ''
    }
   }
})

或者您可以为所有视图设置单个父控制器。

现在，在HTML中你会有

<div>
  <div ui-view="view1"></div>
  <div ui-view="view2"></div>
  <div ui-view="view3"></div>
</div>

如何在角度js中使用ui-router获得层次数据的状态？

2 个答案: