8

角に新しく、ちょうどZurb Foundation 4との調和を図ろうとしています。私はhttp://foundation.zurb.com/docs/components/reveal.htmlコンポーネントを利用しようとしています。ラッピングファンデーション4が角に現れます

:これはポイントまで正常に動作します

directive('modal', function() { 
    return { 
     template: '<div ng-transclude id="notice" class="reveal-modal">' + 
        '<a close-modal></a>' + 
        '</div>', 
     restrict: 'E', 
     transclude: true, 
     replace: true, 
     scope: { 
      'done': '@', 
     }, 
     transclude: true, 
     link: function(SCOPE, element, attrs, ctrl) { 
      SCOPE.$watch('done', function (a) { 
       // close-modal 
      }); 
     } 
    } 
}). 
directive('closeModal', function() { 
    return { 
     template: '<a ng-transclude href="#" class="close-reveal-modal">x</a>', 
     restrict: 'A', 
     transclude: true, 
     replace: true 
    } 
}). 
directive('showModal', function() { 
    return { 
     template: '<a ng-transclude class="reveal-link" data-reveal-id="notice" href="#"></a>', 
     restrict: 'A', 
     transclude: true, 
     replace: true, 
    } 
}); 

、例えば、私はテンプレートから別の通知を表示するモーダルを使用することができます。

ストレートなアプローチは、ディレクティブとしてラップするように見えました

しかし、粘着性があるのはコントローラ/特定のイベント(例えば$watch内)でクローズド・モーダル/ショー・モーダルをトリガーしたい場合です。私は私の指示がクリックを誘発するコントローラを必要としていると仮定していますが、良い角度の練習ですか?

+0

fiddle/plnkrを追加できますか? – GFoley83

答えて

-1

コントローラは、UIイベントを直接トリガーしてUIエレメントを直接操作することはできません。すべてのコードはディレクティブに入るはずです。あなたは何ができるか

は次のとおりです。

  1. バインド親スコープへの指令範囲にブール値とその上の時計を追加します。私はあなたがすでにそれをしたと思います。 OR
  2. コントローラでスコープ$ broadcastを実行しスコープを追加します。
0

この質問は非常に古く、Revealで動作するかどうかわかりません。

app.run(function ($rootScope) { 
    $rootScope.$on('$viewContentLoaded', function() { 
     $(document).foundation(); 
    }); 
}); 

私の作品:しかし、私は唯一の角の.RUN()メソッドに.foundation()メソッドを呼び出すことによって、角度にDropboxのライブラリをラップしてきました。あなたはまた、ユーザーのやりとりを処理するための指示を作成することができると思います。

関連する問題