16

awesomium を使用してゲーム内 UI を作成しています。ある時点で、ゲームがロードされ、任意の新しい UI 要素を作成するための JavaScript のチャンクが実行されます。例えば

jQuery(document.body).append('<span class="game-status-alert">You Lose!</span>');

それはうまく機能しますが、特にangularを使用して、もう少し高度なUI要素を作成したいときに問題が発生します。たとえば、次のようなものです。

function ChatBoxControl($scope) { /* Stuff */ }

jQuery(document.body).append(
    '<div ng-controller="ChatBoxControl"><div ng-repeat="line in chat"><span>{{line}}</span></div></div>'
);

驚くべきことではありませんが、これは新しい角度ビューを作成しません。その html をドキュメントに追加するだけで、ChatBoxControl にバインドすることはありません。

ここでやろうとしていることをどのように達成できますか?

4

2 に答える 2

23

動的に追加された角度コンテンツを$compileする必要があります。何かのようなもの：

jQuery(document.body).append(
    $compile(  
        '<div ng-controller="ChatBoxControl"><div ng-repeat="line in chat"><span>{{line}}</span></div></div>'
    )(scope)
);

次のようなものを使用して取得できる要素のスコープ:

var scope = angular.element('#dynamicContent').scope();

また、他のコントローラーに挿入できる $compile を取得する必要があります。

参照: AngularJS + JQuery : angularjs で動作する動的コンテンツを取得する方法

于 2012-08-21T06:30:53.107 に答える
5

ng-include を ng-repeat と組み合わせて使用​​することをお勧めします。簡単な例を次に示します: http://plunker.no.de/edit/IxB3wO?live=preview

  <div ng-repeat="dom in domList" ng-include="dom"></div>

親 $scope は、ビューにロードされたパーシャルのリストを保持します。そして ng-repeat + ng-include は繰り返し、リストに従ってパーシャルを表示します。

適切なタイミングで、パーシャルを dom リストに追加できます。例えば

$scope.domList.push("chatbox.html");

（ところで、DOM操作をコントローラーに入れることは、角度のある方法ではありません。）

于 2012-08-21T00:31:49.190 に答える