UI-ルータとAngularjs：メインのコンテンツが表示されていない

のindex.html：UI-ルータとAngularjs：メインのコンテンツが表示されていない

<body> 
    <div ui-view="header"></div> 
    <div ui-view></div> 
    <div ui-view="footer"></div> 
    <div id="footer" class="container" /> 
</body>

app.js：

.state('root', { 
    url: '', 
    abstract: true, 
    views: { 
     'header': { 
      templateUrl: 'views/header.html', 
      controller: 'HeaderCtrl' 
     }, 
     'footer': { 
      templateUrl: 'views/footer.html' 
     } 
    }, 
    data: { 
     requiresLogin: true 
    } 
}).state('root.home', { 
    url: '/', 
    views: { 
     '@': { 
      templateUrl: 'views/home.html', 
      controller: 'HomeCtrl' 
     } 
    }, 
    data: { 
     requiresLogin: true 
    } 
})

は、だから私は適切に呼び出されているヘッダーとフッターを持っています画面上に表示されますが、何らかの理由で私のhome.htmlが表示されていません。今のところ、home.htmlにはh1という見出しが含まれています。コンテンツのためにスペースが作成されているようですが、表示していないだけです。

出典

2016-03-27 user1883614

この

.state('root', { 
    url: '', 
    abstract: true, 
    views: { 
     'header': { 
      templateUrl: 'views/header.html', 
      controller: 'HeaderCtrl' 
     }, 
     'main': { 
      template: '<div>This is default main content placeholder</div>' 
     }, 
     'footer': { 
      templateUrl: 'views/footer.html' 
     } 
    }, 
    data: { 
     requiresLogin: true 
    } 
}).state('root.home', { 
    url: '/', 
    views: { 
     '[email protected]': { 
      templateUrl: 'views/home.html', 
      controller: 'HomeCtrl' 
     } 
    }, 
    data: { 
     requiresLogin: true 
    } 
})

とのindex.htmlにしてみてください。

<body> 
    <div ui-view="header"></div> 
    <div ui-view="main"></div> 
    <div ui-view="footer"></div> 
    <div id="footer" class="container" /> 
</body>

出典

2016-03-27 04:06:09 sam

が、私はまだ動作しない、ことを試してみました...私は問題が何であるかを把握することはできません。 – user1883614

明らかにそれはした - 問題は、私のヘッダーが私のメインのコンテンツをブロックするサイドバーを持っていたということでした... – user1883614

UI-ルータとAngularjs：メインのコンテンツが表示されていない

答えて

関連する問題