0

希望我能清楚地解释这一点。首先，我正在使用 ng-admin 并且我知道如何创建自定义视图：

我试图弄清楚如何在同一个自定义页面中创建嵌套视图。具体来说，我有一个视图需要在页面上有 3 列——每列都有它们的功能（和服务）。

例子：

在下图中，我有 3 个视图。

  1. 第一列将调用自定义服务来获取集合列表（在 ng-admin speak 中也称为实体）并允许用户选择一个集合
  2. 中间列将显示所选集合/实体中的项目列表，并允许用户选择一个项目
  3. 最后一列将用于编辑所选项目

访问此页面的 url 应该是 myapp.com/ng-admin/#collections/collections/collection/1（1 是要查看/编辑的项目的 id）

ng-admin 的嵌套视图

我的代码：

//collections state
myApp.config(function ($stateProvider) {
$stateProvider.state('collections', {
    abstract: true,
    parent: 'ng-admin',
    url: '/collections/',
    controller: collectionsCtrl,

    templateUrl: '/app/collectionsView.html'
});

//collection state
myApp.config(function ($stateProvider) {
$stateProvider.state('collections.collection', {

    parent: 'ng-admin',
    url: '/collections/collection/:ID',
    controller: collectionCtrl,
    templateUrl: '/app/collectionView.html'
});
... ommiting first two controllers

然后在集合项目控制器中，我有：

myApp.controller('ItemViewCtrl', ['$scope', 'Events', '$stateParams', '$sce', function($scope, Events, $stateParams, $sce) {

$stateParams.ID && Collection.find($stateParams.ID).then(function(item) {
    $scope.item = item;

});
  $scope.view = function(id) {
            $state.go('days.day', {
                'ID': id
            })
        };



 }]);

我的 collectionsView.html

<div ng-include src="'/app/tpl/collectionView.html'" include-replace>
</div>
<div class="inner-content full-height" ui-view></div>

在我的 collectionView.html

   <ul>
        <li ng-repeat="collections as collection" >
            <a ui-sref="collections.collection.id">
               Link to collection
            </a>
        </li>
     <ul>

我目前的问题：

我可以让集合/集合显示两个视图，但它不会显示第一列。

如果我只去集合/我只能看到第一个列（但只有当我从 $stateParam 路由器选项中删除 abstract:true 时。）

缺少什么？

4

1 回答 1

1

解决了：

这帮助我意识到我不需要父属性或 url 的第一部分，因为当我将“statecollections.collection”作为 $stateProvider 的一部分时，它们都是从父级继承的。

//collection state
myApp.config(function ($stateProvider) {
$stateProvider.state('collections.collection', {

   // parent: 'ng-admin', <-REMOVED
   url: '/collections/collection/:ID', // Didn't need the /collections part of the url
  controller: collectionCtrl,
   templateUrl: '/app/collectionView.html'
});
于 2017-02-24T22:37:57.913 回答