Question

在我的Angular UI项目中，我在配置中嵌套了视图。当我在浏览器中加载网页时，虽然控制器触发并且父视图正确呈现，但这些嵌套视图不会显示。应该在范围内的所有东西都在范围内。

这是我的配置

angular.module('quizApp', ['ui.router'])
.config(function($stateProvider, $urlRouterProvider) {
$urlRouterProvider.otherwise('/');

$stateProvider
.state('home', {
  templateUrl: 'components/home/homeView.html',
  controller: 'homeCtrl',
  url: '/'
})
.state('quiz', {
  controller: 'quizCtrl',
  url: '/quiz/:quizName',
  templateUrl: 'components/quiz/views/quizContainerView.html'
})
.state('quiz.view', {
  parent: 'quiz',
  views: {
    'list': {
      templateUrl: 'components/quiz/views/questionListWrapperView.html'
    },
    'detail': {
      templateUrl: 'components/quiz/views/questionDetailView.html'
    }
  }
})
})

测验视图列表和详细信息预计会显示在页面上。

这是我的回购 old docs

感谢您的帮助！

Answer 1

您错过了子视图中的网址属性

$stateProvider
.state('home', {
  templateUrl: 'components/home/homeView.html',
  controller: 'homeCtrl',
  url: '/'
})
.state('quiz', {
  controller: 'quizCtrl',
  url: '/quiz/:quizName',
  templateUrl: 'components/quiz/views/quizContainerView.html'
})
.state('quiz.view', {
  parent: 'quiz',
  url: '/something',
  views: {
    'list': {
      templateUrl: 'components/quiz/views/questionListWrapperView.html'
    },
    'detail': {
      templateUrl: 'components/quiz/views/questionDetailView.html'
    }
  }
})
})

嵌套视图将是/ quiz /：quizName / something

UI-Router嵌套视图不会渲染（无错误）

1 个答案: