Question

我尝试使用两个不同的ui-view在同一个视图中同时渲染两个模板。我可能错过了一些东西，但我不知道是什么。我可以得到一些帮助吗？

我的App.js

var routerApp = angular.module('routerApp', ['ui.router']);

routerApp.config(function($stateProvider) {

  //$urlRouterProvider.otherwise('/home');

  var People = {
    name: 'People',
    url: '/People',
    views: {
      'PeopleView': {
        templateUrl: 'People.html'
      }
    }

  }

  var Company = {
    name: 'Company',
    url: '/Company',
    views: {
      'CompanyView': {
        templateUrl: 'Company.html'
      }
    }
  }

  $stateProvider.state(People);
  $stateProvider.state(Company);
});

HTML

<div class="container">
  <fieldset>
    <div class="row">
      <legend>Content</legend>
      <div ui-view="PeopleView" class="col col-md-4"></div>
      <div ui-view="CompanyView" class="col col-md-4"></div>
    </div>
  </fieldset>
</div>

Full Code

Answer 1

我不太确定你需要实现什么，但我想你应该将你的观点置于同一状态并在其中进行工作

$stateProvider.state('mainState', {
    views: {
      'CompanyView': {
        templateUrl: 'Company.html'
      },
      'PeopleView': {
        templateUrl: 'People.html'
      }
    }
})

我已经编辑了你的插件以说明我的意思 - http://plnkr.co/edit/V0lF78MZhrOnwXF7F6Ih?p=preview

尝试在同一视图中呈现两个模板（Ui-Router）

1 个答案: