Question

我正在处理某些事情，我想将内容重定向到angularjs中的页面，但我遇到以下错误：

angular.js:12477 Error: Could not resolve 'dashboard.home' from state 'dashboard'

我的代码：

.state(
        'dashboard.home',
        {
            url: '/home',
            views: {
                "content@main": {
                    templateUrl: '/home'
                    // controller: 'HomeController',
               }
            }
        }
    )

.state(
        'dashboard',
        {
            url: '',
            parent: "main",
            views: {
                "sidebar@main": {
                    templateUrl: "/sidebar/view"
                }
            }
        })

sidebar.html.twig

 <li>
      <a ui-sref="dashboard.home">Home <span class="sr-only">(current)</span></a>
 </li>

状态'dashboard.home'存在，错误出现的原因是什么？

Answer 1

我认为您可能尝试使用视图将页眉/页脚/侧边栏与内容分开，这是唯一可以根据状态进行更改的内容。

我没有答案你的问题究竟是什么，但我可能会回答你可能想要解决的更广泛的问题：

如何为标题/内容/页脚和内容导航的嵌套声明混合视图？

解决方案：仅对标题/内容/页脚使用视图，使用'@'通过使用默认视图（无名称）插入直接子项，并像通常没有视图一样使用grand child

// root state
.state('home', {
    url:'/home',
    views:{
        'header':{
            templateUrl: 'template/header.html',
            controller:'HeaderCtrl'

        },'sidepanel':{
            templateUrl: 'template/sidepanel.html', 
            controller:'SidePanelCtrl', 
        },'footer':{
            templateUrl: 'template/footer.html'
        }
    },
    'abstract':false
  })
  //direct child
  .state('home.main', {
      url:'/main',
      // need that for every direct child of home
      views:{
          '@':{templateUrl: 'template/main.html',
              controller: 'MainCtrl'
          }
      }        
  })
  //grandchild
  .state('home.main.child1', {
      url:'/child1',
      templateUrl: 'template/child1.html',
      controller: 'Child1Ctrl'
        // NO view anymore for grand child!!
      }        
  })

和相关的HTML

<section id="header">
    <!--- not container -->
    <div data-ui-view="header"></div>
</section>
<section id="content">
    <div class="row clearfix">
        <div id="mySidebar>
            <div data-ui-view="sidepanel"></div>
        </div>
        <div id="myContent">
            <div data-ui-view></div>
        </div>
    </div>
</section>
<section id="footer">
    <div data-ui-view="footer"></div>
</section>

Answer 2

templateUrl需要您要呈现的html模板的相对路径。

.state(
    'dashboard.home',
    {
        url: '/home',
        views: {
            "content@main": {
                templateUrl: 'home.html'
           }
        }
    }).state(
    'dashboard',
    {
        url: '',
        parent: "main",
        views: {
            "sidebar@main": {
                templateUrl: "sidebar/view.html"
            }
        }
    })

ui-sref不工作状态angularjs

2 个答案: