コンポーネントを使用してまたは角1.5チュートリアルに続いて別のコントローラ

Question

を使用し、彼らはcontrollerがAngular2への移行を準備するためには、この

angular. 
module('myList'). 
component('myList', { 
    templateUrl: 'template.html', 
    controller: ['MyList', 
    function MyController($scope){ 
     var self = this; 
     $scope.get({ 
     id : '0' 
     }).then(function(response){ 
     return self.contents; 
     }) 
    } 
    ] 
}); 

ようcomponent()に包まれていた、でcontrollerを置くという点でベストプラクティスものですそれ自身のjsファイルですか？
この例に従うべきですか、またはこのコードを懸念して2つのファイルに分ける必要がありますか？

注：私はちょうど1.5のcomponent()クラスが去年に出てきたことに気がつきました。このリリースより前にチュートリアルで誤解されてしまいました。

Answer 1

あなたのエンティティを別のファイルに保存することをお勧めします。moduleアイテム登録。簡単な例について説明しましょう：

あなたがUIのものであるより大きなモジュールを持っているとしましょう。module('uiStuff')

uiStuff（フォルダ）

• uiStuff.module.js

• uiStuff.service.js

  はmyList（フォルダ）

  • はmyList：だから私はこのような構造を示唆しています。 component.js
  • myList.controller.js
  • myList.partial.html

あなたのモジュールのファイルは常にちょうど角度の実体登録含まれます

- 将来的にはサービス、コンポーネント、ディレクティブなどをこの中に必要がないので、それはあなたにいくつかの利点を提供しますAngular2のコードを使用すると、これらのファイルを簡単に削除できます。

例uiStuff.module.js：SomeService

angular.module('uiStuff') 
    .service('someService', SomeService) 
    .component('myList', myListComponent); 

- いくつかの関数コンストラクタ、及びmyListComponent、コンポーネントオブジェクトです。のは、myList.component.js下に見てみましょう：

var myListComponent = { 
    bindings: { 
     variable:'<' 
    }, 
    templateUrl: 'myList.partial.html', 
    controller: MyController 
    // and all other component settings 
} 

と同じようにコントローラとHTMLテンプレート、ちょうど別のファイルインチもちろん、私の考えでは、移行を念頭に置いて、TypeScript言語に切り替える方がよいでしょう。これは、多くのことを簡素化します。

結論： しかし、いずれにせよ、私のポイントは、ES5、ES6と活字体AngularJs移行戦略の両方のために一般的である：

1. が異なるファイル（コントローラ、コンポーネント、サービスなど）
2. キープでエンティティを保ちますモジュールは別ファイル（例ではuiStuff.module.js）に登録します
3. Angular2命名規則（name.service.js、など）に従うようにしてください

Answer 2

私はそれを示唆した、 /* mylist.controller.js中*/

function MyController($scope){ 
    //your code 
    } 

は今私のビュー/コンポーネント、

declare var MyController:any; 

@Component({ 
    selector: 'app-elem', 
    templateUrl: 'test.html' 
}) 

export class MyComponent { 
    new MyController(this) 
} 

にここにいくつかの提案がありますhttp://blog.rangle.io/upgrade-your-application-to-angular-2-with-ng-upgrade/