1

ng-repeatを使用する場合、その中でコントローラーをどのように使用すればよいですか?

たとえば、1週間の一連の日をループしている場合:

<ul ng-controller="WeekCtrl">
    <li ng-repeat="d in days">
        <span ng-controller="DayCtrl">
            {{dayOfWeek}} {{date}}: {{info}}
        </span>
    </li>
</ul>

しかし、私はそれがDayCtrl何日dであるかを知りたいので、それを範囲から外さなければなりません:

app.controller('DayCtrl', function($scope){
  $scope.date = $scope.d.date;
  $scope.dayOfWeek = 
    ['Mon','Tue','Wed','Thr','Fri','Sat','Sun']
    [$scope.d.date.getDay()];
  $scope.info = '... extra info...';
});

ただし、これにより、ディスプレイとコントローラーの間に依存関係が作成されます。d.date理想的には、議論として伝えたいと思います。

ディレクティブ+コントローラーを記述d.dateして、属性として渡すことができます。しかし、それは私がもっとたくさん書いて、その日のhtmlを別のテンプレートに移動しなければならないことを意味します、そして私は他の場所でDayCtrlを使うつもりはありません。

または、試して使用することもできます<span ng-init="date=d.date">が、これも汚れた感じがします。

これを行う正しい方法は何ですか。

Plunkerの完全なサンプルコード:http://plnkr.co/edit/wUxNFSEGjcDN7KlOLYdvこれは私が数日と数週間で抱えている問題を示しています。

4

1 に答える 1

2

d.date私には、これは属性として指定されたディレクティブの仕事のように見えます。
どのように設定されているかはわかりませんがinfo、ディレクティブにコントローラーは必要ない可能性があります。

その日のHTMLは、個別の/ディレクティブテンプレートである必要はなく、HTMLに残すことができます。

 <li ng-repeat="d in days">
    <day date="d.date">
       {{dayOfWeek}} {{date}}: {{info}}
    </day>
 </li>

指令:

app.directive('day', function() {
  return {
    restrict: 'E',
    scope: { date: '=' },
    link: function(scope) {
     scope.dayOfWeek =  ['Mon','Tue','Wed','Thr','Fri','Sat','Sun'][scope.date.getDay()];
     scope.info = '... extra info...';
    }
  };
});

Plunkr

参考までに、ng-initを使用する場合は、ng-controllerに含めることができます。

<span ng-controller="DayCtrl" ng-init="date=d.date">
于 2013-01-30T17:20:14.457 に答える