2016-05-07 19 views
0

私はコードをコンポーネントルーティングのチュートリアルと少し違うように整理しようとしています。かなり簡単に私はこの構造を持つ私のアプリにしたい。角度1の角度成分を区切ることができません

app.js 
-components/ 
+-settings/ 
    +-settings.js 
    +-general/ 
    +-generalSettings.js 

私は角1.5と角度ルータthis versionを使用しています:これは

'use strict'; 
angular.module('admin', [ 'ngComponentRouter', 'settings' ]) 

    .config(function($locationProvider) { 
    $locationProvider.html5Mode(true); 
    }) 

    .value('$routerRootComponent', 'admin') 

    .component('admin', { 
    templateUrl: 'scripts/app.html', 
    $routeConfig: [ 
     {path: '/settings/...', name: 'Settings', component: 'settings', useAsDefault: true} 
    ] 
    }) 

settings.js

angular.module('settings', []) 
    .component('settings', { 
     template: '<h1>settings</h1><ng-outlet></ng-outlet>', 
     $routeConfig: [ 
      {path: '/general', name: 'GeneralSettings', component: 'generalSettings', useAsDefault: true} 
     ] 
    }) 
    .component('generalSettings', { 
     template: '<h2>General</h2>', 
     controller: GeneralSettingsCtrl, 
    }) 

function GeneralSettingsCtrl(){ 
} 
012をapp.jsの作品

しかし、settings.jsファイルから一般設定コンポーネントを削除しようとすると、エラーCannot read property '$routerOnActivate' of undefinedが発生します。

私は依存関係を定義している/注入していると思われます。あるいは、generalSettings(独自のモジュール 'generalSettings'を定義し、それを注入することは機能しているようですが、私はこれを確信していません最高の選択肢です)。私はそれを行うための最善の方法をよく分かりません。 1つのファイルにすべての単一のネストされたコンポーネントを持つことを実際には試みていません。アドバイスをお願いします、ありがとう!

答えて

0

理由はわかりませんが、設定から「コンポーネント」の設定をapplicationSettingsに変更すると、正常に動作します。

私はコードをコンポーネントルーティングのチュートリアルと少し違って整理しようとしています。かなり簡単に私はこの構造を持つ私のアプリにしたい。これは

app.js

'use strict'; 
angular.module('admin', [ 'ngComponentRouter', 'settings' ]) 

    .config(function($locationProvider) { 
    $locationProvider.html5Mode(true); 
    }) 

    .value('$routerRootComponent', 'admin') 

    .component('admin', { 
    templateUrl: 'scripts/app.html', 
    $routeConfig: [ 
     //-----------------> changed the component name 
     {path: '/settings/...', name: 'Settings', component: 'applicationSettings', useAsDefault: true} 
    ] 
    }) 

settings.jsを作品:私は[1]の角度ルータの[このバージョン]角度1.5を使用してい

app.js 
-components/ 
+-settings/ 
    +-settings.js 
    +-general/ 
    +-generalSettings.js 

angular.module('settings', []) 
    // ----------------------------------> changed component name to application settings 
    .component('applicationSettings', { 
     template: '<h1>settings</h1><ng-outlet></ng-outlet>', 
     $routeConfig: [ 
      {path: '/general', name: 'GeneralSettings', component: 'generalSettings', useAsDefault: true} 
     ] 
    }) 
    .component('generalSettings', { 
     template: '<h2>General</h2>', 
     controller: GeneralSettingsCtrl, 
    }) 

function GeneralSettingsCtrl(){ 
} 
関連する問題