1

ngTransclude を使用して、一部のコンテンツの周りに div-wrapper を作成するディレクティブを作成しました。この非常に単純な例を参照してください: http://jsfiddle.net/DHzrr/1/

HTML から group 要素を削除した場合

<div ng-controller="TodoCtrl">
  <form ng-submit="addTodo()">
    <input type="checkbox" ng-model="checked">
  </form>
  <div ng-hide="checked">NOT CHECKED</div>
</div>

「ng-hide」リスナーが機能しています。したがって、私のグループ ディレクティブは、イベントの発行または $scope の分離を飲み込みます。どうすればこれを機能させることができますか?

ディレクティブ定義オブジェクトで scope:true 属性を使用した場合にのみ、新しいスコープが作成されると思いました。

4

1 に答える 1

2

transclude: true親 (TodoCtrl) スコープからプロトタイプ的に継承する新しい子スコープを作成します。この問題は、次の 3 つの方法のいずれかで解決できます。

  1. (推奨) 親スコープで定義されたオブジェクト プロパティにバインド:ng-model="obj.checked"およびコントローラーで:$scope.obj = {checked: false}
    フィドル
  2. 使用するng-model="$parent.checked"
  3. 関数を使用して親のモデルを更新します: に追加ng-change="toggle()"してからinput、コントローラーで関数を定義します。$scope.toggle = function() { $scope.checked = !$scope.checked }

AngularJS のスコープ プロトタイプ/プロトタイプ継承のニュアンスは何ですか?も参照してください。、セクション指令項目「4. transclude: true

于 2013-03-19T16:33:48.690 に答える