2

コントローラーのスコープを制限するために属性セレクターを使用する方法を理解できません。最小限のコントローラー コードは次のとおりです。

import 'package:angular/angular.dart';

@NgDirective(
  selector: '[my-controller]',
  publishAs: 'ctrl'
)
class MyController {
  String foo = 'fooooooooooooo';
}

main() {
  ngBootstrap(module: new Module()
      ..type(MyController));
} 

そして、そのコントローラーを使用するビューは次のとおりです。

<!DOCTYPE html>
<html>
  <body>
    <div> 

      <!-- DOES NOT WORK. MAKES SENSE. -->           
      <p>Outside ng-app: {{ctrl.foo}}</p>
    </div>

    <div ng-app>
      <div my-controller>
        <!-- WORKS. MAKES SENSE -->           
        <p>Inside my-controller div: {{ctrl.foo}}</p>
      </div>

      <!-- WORKS. WHY? It is outside the div with the my-controller attribute -->
      -->
      <p>Outside my-controller div: {{ctrl.foo}}</p>
    </div>

    <script type="application/dart" src="main.dart"></script>
    <script type="text/javascript" src="packages/browser/dart.js"></script>
  </body>
</html>

予想通り、{{ctrl.foo}}コードはng-app. また、予想どおり、{{ctrl.foo}}の中で動作します<div my-controller>しかし、なぜそれが外 で機能するのかわかりません<div my-controller>。何か案は?

4

2 に答える 2

5

問題は、NgDirectivenotを使用していることですNgControllerNgDirective独自のスコープを作成しないため、リークが発生します。に切り替えるとNgController、問題が解決するはずです。

于 2014-01-27T18:24:08.190 に答える
1

問題は @NgDirective が独自のスコープを作成しないという事実にあると思います...

@NgComponent を試して、
「Inside my-controller div: {{ctrl.foo}}」
をテンプレート プロパティに移動します。

于 2014-01-09T04:03:30.863 に答える