javascript - 为什么 ng-view 不渲染我的模板？

Question

我坚持将 ui-router 集成到我的 Angular 应用程序中。 为了简单起见，它可以工作，只是模板不会被渲染。 我也没有收到任何错误。

html布局文件

div.navbar.navbar-default.navbar-fixed-top
  ul.nav.navbar-nav
    li
      a(ui-sref='index') Home
    li
      a(ui-sref='about') About

div.container
  div.view-frame(ui-view)

主页部分内容(大约看起来相似)

div.row(ng-controller='HomeCtrl')
  div.col-sm-12
    h1.lead Welcome

我的路线

$stateProvider
  .state('about', {
    url: '/about/',
    templateUrl: '/partials/about.html'
    //template: '<h1>Test</h1>' doesn't work as well
  })
 .state('index', {
    url: '/',
    templateUrl: '/partials/index.html'
  })

当我单击其中一个链接并检查我的网络流量时，模板/部分会被加载，并且 url 也会发生变化。 我什至可以在 chrome 开发者工具中看到 html 的正确预览。 我唯一的问题是，ui 路由器确实将其加载到 ui-view 指令中。

我使用最新的Chrome和最新版本的ui-router。 我通过 api 加载所有部分，但这应该很重要。 我之前使用过普通的路由提供商，效果很好，我尝试“升级”。

我做错了什么还是我发现了一个错误？

Answer 1

看起来您正在使用 Jade 。省略属性的值会使该值作为属性名称，因此您生成/呈现的 HTML 看起来像

<div class="view-frame" ui-view="ui-view"></div>

当 ui-router 在您的状态中查找名为 'ui-view' 的 View 时，它找不到它。当它在模板中查找名为 '' 的 View 时，它找不到它。您需要将属性设置为空字符串，以便 ui-router 可以找到默认值 ''

div.view-frame(ui-view='')