Question

在我的一个应用程序中，我创建了一个主控制器和一个带有ui-view的主页面。 main_live_video_chat.html正在加载到主页ui-view中。此子页面 main_live_video_chat.html 包含多个ui-view控制器。我已经根据不同的状态创建了路径，这些子ui视图在主页面的一部分时起作用，但在配置子页面 main_live_video_chat.html 时没有显示任何内容。

app.config如下所示：

app.config([
  '$locationProvider',
  '$stateProvider',
  function($locationProvider, $stateProvider) {

    //setup our two states, archive and live
    $stateProvider
      .state('player', {
        abstract: true,
        url: "/",
        views: {
            '': {templateUrl: "views/main.html",  
                controller: "mainController",
                controllerAs: "main"
            },
          //******This config work fine.******
          'schedule@player': { 
                templateUrl: "views/rail/schedule.html",
                controller: "scheduleController",
                controllerAs: "schedule"
            }
        }
      })
      .state('player.live', {
          url: "^/live/:playerId",
          templateUrl: "views/main_live_video_chat.html"

          //******This config doesnt work.******
          //views: {
          //    '@': {
          //        templateUrl: "views/main_live_video_chat.html",
          //    },

          //    'schedule@player': {
          //        templateUrl: "views/rail/schedule.html",
          //        controller: "scheduleController",
          //        controllerAs: "schedule"
          //    },
      })
  }
]);

请注意，此日程安排视图需要在main_live_video_chat.html

内的vi视图中显示

Answer 1

它无法正常工作。

父州将其模板“views / main.html”注入index.html

views: {
    '': {templateUrl: "views/main.html",

该模板包含侧视图 <div ui-view="schedule">

的目标

但是孩子正在用这句话替换父母的模板“views / main.html”

  views: {
      '@': {
          templateUrl: "views/main_live_video_chat.html",

所以，现在，没有目标 <div ui-view="schedule"> ......这就是为什么找不到它的位置：

  //******This part doesnt work.******
  //views: {
  //    '@': {
  //        templateUrl: "views/main_live_video_chat.html",
  //    },

  // THERE is NO target 'schedule' created by parent 'player'
  //    'schedule@player': {
  //        templateUrl: "views/rail/schedule.html",
  //        controller: "scheduleController",
  //        controllerAs: "schedule"
  //    },

解决方案：

要么不替换父级的未命名视图目标...只要目标'schedule'...或
孩子必须重复所有这些东西

Angularjs嵌套ui视图不起作用

1 个答案: