UI Routers 1.0.0で角1.5.9の定型文を設定しようとしています。 ui-view内に親状態のコンポーネントを表示することはできますが、親の中に状態を入れ子にすると、コンポーネントが私のUIビューに注入されません。コンポーネントは私のUIビューに挿入されていません
これは、これはそれがで私は、UIビューに何かを注入することができないんだ。この点にある主成分
<div class="main-container">
<banner></banner>
<div ui-view='ui-view></div>
</div>
である私のindex.html
<body ng-app="app">
<ui-view></ui-view>
</body>
です。
これは私が私が間違ってやっているかわからないんだけど、私のjavascriptファイル
$stateProvider
.state('app', {
url: '/',
component: 'main'
})
.state('app.login', {
url: '/login',
views: {
'ui-view': {
templateUrl: './app/login/login.html'
}
}
});
で、正しい道へ/方向の任意の助けいただければ幸いです。
私はすべてが期待どおりに動作する親状態としてログインを参照するとき
役に立つかもしれませんEDIT
追加情報。
ログインコンポーネントは、私のメインモジュールに含まれている別のモジュールの一部です。
答えて
各親コンポーネントで一人の子供の状態を入れ子にするために、あなたが主成分のテンプレートで使用ui-view
ディレクティブは、「UI-ビュー」の値を加算していたとして名前のビューを使用する必要はありません。名前の付いたビューは、複数のUIビューに対処する必要がある場合にのみ必要です。次に名前で参照する必要があります。
名前付きビューを正しくターゲティングしていないため、サンプルではコンテンツが表示されません。名前付きビューがルートファイルではないテンプレートに定義されている場合、それらの名前付きビューに対処する方法にいくつかのルールがあります。その場合、あなたのケースでは "ui-view @ app"を意味する "ui-view-name @ state"構文でui-viewを参照することにより、より具体的にする必要があります。
あなたの単純なケースでは、ui-viewの名前を省略して、状態設定のviews
セクションをプレーンテンプレート(またはコンポーネント参照)に置き換えてください。ネスティングビューの詳細については
.state('app.login', {
url: '/login',
templateUrl: './app/login/login.html'
});
、ui-router docsに大きなサンプルアプリケーションを見てください。
ちょっと、名前付きビューを削除するようにコードを変更しました。/loginに行くと、空白のページしか表示されません。要素を検査するとき、UIビューは空です。私が提供する必要がある他の有用なものがあれば私に知らせてください。 – Sai
コンソールログでエラーを確認してください。いずれかがあります?また、ログインが角型コンポーネントであるか、テンプレートとコントローラだけを指定して参照するかによっても異なります。あなたの最後の答えでは、ログインはtemplateUrl経由で直接使用することができないコンポーネントだと思われます。これは、コンポーネントではないレガシースタイルのためのものです。だから、ui-viewの名前を省略し、コンポーネントとしてログインを参照することは、そのトリックでしたか? –
これは本当に奇妙なので、私はなぜそれがそのように機能したかについては説明していません。私がしたことは、javacriptファイルを以下のものに変更することでした。
私の親の代わりに '/'を '/ login'に変更しました。私は誰かがこの行動の背後にある理由を知っているかどうか知りたいと思うだろう。
$stateProvider
.state('app', {
url: '/',
templateUrl: path/to/main_component.html
})
.state('app.login', {
url: '/login',
views: {
'ui-view': {
templateUrl: './app/login/login.html'
}
}
});
あなたはui-view
がその親の状態テンプレートにチェックされますapp.login
ビュー(状態)です。テンプレートがない場合は、レンダリングする場所がわかりません。
'ui-view':{}
は、その親ビューを対象としています。 '[email protected]':{}
は、index.htmlのルートコンポーネントをターゲットにしています
- 1. 私のデータベースにコメントが挿入されていません
- 2. AngularJSのUIビューにngOptionsがロードされていません
- 3. LINQ挿入 - エラーは表示されませんが挿入されません
- 4. EntityManagerは@PersistenceContextのステートレスセッションBeanに挿入されていません
- 5. datepickerが入力フィールドに挿入されていません
- 6. UIブートストラップを挿入できません
- 7. 私のコードは実行されていますが、値は挿入されていません
- 8. Android:行は挿入されません。
- 9. 新しい行がデータベースに挿入されていません
- 10. Ajaxレスポンスオプションの値がデータベースに挿入されていません
- 11. Wordpressのプラグインデータがカスタムテーブルに挿入されていません
- 12. データがcodeigniterのデータベースに挿入されていません
- 13. アンドロイドアプリケーションのデータベースに日付が挿入されていません
- 14. フォームの値がデータベースに挿入されていません
- 15. divの内容がデータベースに挿入されていません
- 16. データがmySQL(MariaDB)のテーブルに挿入されていません
- 17. パラメータがMYSQLのストアドプロシージャに挿入されていません
- 18. 私はMySQLにデータを挿入しようとしていますが、エラーはありませんが、データが挿入されていませんか?
- 19. 挿入クエリが注文テーブルを介して挿入されていません
- 20. 私のビューはiPhoneでリフレッシュされていません
- 21. Angular2 FormArrayの挿入はそれに応じてビューを更新しません
- 22. 更新/挿入はデータソースでサポートされていません
- 23. ModelState.AddModelErrorが私のビュー内に表示されていません
- 24. UI-Routerネストされた状態ビューはレンダリングされません(レンダリング親ビュー)
- 25. データがFirebaseに挿入されていません
- 26. Phpmyadminにデータが挿入されていません
- 27. PHPがデータベースに挿入されていません
- 28. FMDBがDBに挿入されていません
- 29. レコードがデータベースsqliteに挿入されていません
- 30. データがMySQLデータベースに挿入されていません
'index'ページの' ui-view'コンテナに 'login.html'をロードする場合は、'
1.0.0-beta.1は、私が使っているバージョンです。私は名前付きビューを取り除きましたが、要素を検査すると空のUIビューを持つ空白のページが表示されています – Sai