0

このプラグインを AngularJS アプリと変数で使用して、開始日と終了日が変更されるたびに保存しています。

日付範囲の変更時に、コントローラ メソッドを呼び出してページのデータを更新するにはどうすればよいですか?

スコープのこのメソッドを呼び出すように：

$scope.updateDataOnDateRangeChange = function(){
    // here calling few services to fetch new data for the page
    // for the selected date range
}

このプラグインに ng-click または ng-change またはカスタム ディレクティブを使用する方法は?

4

2 に答える 2

1

jQuery プラグインを使用するための基本的な手順は、通常、そのディレクティブを作成することです。コールバック内でlinkプラグインを初期化します。ここでは、jQuery または jQ-lite オブジェクトとしての要素、angular スコープ、およびプラグイン コールバックにアクセスできます。$.apply()サード パーティ コード内でスコープを変更する場合の u に関する重要なコメントを参照してください。

サンプル HTML:

<input my-picker type="text"/>

基本的なスクリプトの概要:

app.directive('myPicker', function ($timeout) {
    return {
        link: function (scope, elem, attrs) {
            $timeout(function () {
                /* elem is a jQuery or jQ-lite object representing the element*/
                elem.daterangepicker({
                    format: 'YYYY-MM-DD',
                    startDate: '2013-01-01',
                    endDate: '2013-12-31'
                },
               /* not overly familiar with this plugin but this callback 
                 should allow you to set angular scopes */
                function (start, end) {
                    /* important to do any scope changes within `$.apply()` so angular
                      becomes aware of changes from third party code*/
                    scope.$apply(function(){
                        /* do what you need here with angular scope
                         have access to plugin data as well as angular scope*/

                    })
                });
            }, 1)
        }
    }

})

他の属性をマークアップに追加し、その属性を使用してさまざまなプラグイン オプションも設定することで、このディレクティブを拡張できます。

于 2013-10-27T03:33:52.050 に答える
0

あなたが説明したことを行うべきAngularJS内に存在するngChangeディレクティブがあります。

このディレクティブを日付範囲入力要素に追加します。

于 2013-10-26T20:48:31.567 に答える