Question

我在配置文件中有以下状态：

MessageBox.Show( @"Could not read the Windows Registry."+
                 "Bailing out...","Registry Error",MessageBoxButtons.OK,MessageBoxIcon.Error);

在我的var home = { name: 'home', template: '<div ui-view></div>', url: '/', }; var homeSubjects = { name: 'home.subjects', url: 'Subjects', views: { '': { templateUrl: 'app/subjects/partials/subjects.html' }, 'subjects.intro@home.subjects': { templateUrl: 'app/subjects/partials/subjects_intro.html', }, 'subjects.auth@home.subjects': { templateUrl: 'app/subjects/partials/subjects_auth.html', } } }; var homeSubjectsSubjectExams = { name: 'home.subjects.exams', url: '/Exams', views: { '': { templateUrl: 'app/exams/partials/exams.html'}, 'exams.intro@home.subjects.exams': { templateUrl: 'app/exams/partials/exams_intro.html', }, 'exams.auth@home.subjects.exams': { templateUrl: 'app/exams/partials/exams_auth.html', }, } }文件中，我有以下代码：

index.html

在<div ui-view></div>我有：

subjects.html

在<div id="subject"> <div class="intro" ui-view="subjects.intro"></div> <div class="auth" ui-view="subjects.auth"></div> </div> <div ui-view></div> // <--- I want the exams.html to appear here我有：

exams.html

我希望exams.html显示在subject.html页面下方。任何人都知道我该怎么做？

Answer 1

你应该在那里。现在的例子是工作。

全部a plunker with that - 按现状。

我几乎没有改变任何（只使用模板而不是templateUrl使其变得更简单）：

.state('home.subjects', {
    name: 'home.subjects',
    url: 'Subjects',
    views: {
      '': {
        templateUrl: 'app/subjects/partials/subjects.html'
      },
      'subjects.intro@home.subjects': {
        //templateUrl: 'app/subjects/partials/subjects_intro.html',
        template: 'app/subjects/partials/subjects_intro.html',
      },
      'subjects.auth@home.subjects': {
        //templateUrl: 'app/subjects/partials/subjects_auth.html',
        template: 'app/subjects/partials/subjects_auth.html',
      }
    }
})

.state('home.subjects.exams', {
  name: 'home.subjects.exams',
  url: '/Exams',
  views: {
    '': {
      templateUrl: 'app/exams/partials/exams.html'
    },
    'exams.intro@home.subjects.exams': {
      //templateUrl: 'app/exams/partials/exams_intro.html',
      template: 'app/exams/partials/exams_intro.html',
    },
    'exams.auth@home.subjects.exams': {
      //templateUrl: 'app/exams/partials/exams_auth.html',
      template: 'app/exams/partials/exams_auth.html',
    },
  }
})

如果我们转到<a ui-sref="home.subjects.exams">

，这就是结果

app/subjects/partials/subjects_intro.html
app/subjects/partials/subjects_auth.html
app/exams/partials/exams_intro.html
app/exams/partials/exams_auth.html

我们可以看到，home.subjects位于页面上，下方注入exams子状态

检查here

如何使用多个命名的ui-views

1 个答案: