1

Angular-UI-Mask の動作がおかしいため、入力の一部にjquery-inputmaskを使用していますが、Angular で入力が動的に挿入されると、マスクが取得されません。

<li ng-repeat="item in items">
    <input type="text" name="birth_date" class="span2 format_date" ng-model="birth_date" placeholder="Data de Nascimento" required />
</li>

これは関連するスクリプトです

<script type="text/javascript">
    jQuery(document).ready(function(){
        $(".format_date").inputmask("99/99/9999");
    });
</script>

マスクを新しい入力に強制的に設定するためにできることはありますか?

4

1 に答える 1

1

jQuery.inputMask のような jQuery プラグインは、(コードが示すように) ドキュメントの準備が整ったときに動作を DOM 要素にアタッチすることによって機能します。これは 1 回実行され、二度と実行されないため、動的に追加されるコンテンツの場合、このアプローチは機能しません。

代わりに、対応する DOM が変更されるたびに実行されるものが必要です。したがって、「アイテム」リストに「アイテム」が追加されるたびに、要素が追加され、対応する jQuery 関数がその要素に対して実行されます。これには AngularJS を使用する必要があり、独自のディレクティブを作成することもできますが、ありがたいことに、Angular UI のUI.Utilsの一部としてjQuery Passthrough プラグインというコードが既に作成されています。

これが動作中の Plunkrです。

次のように、スクリプトを上部に含める必要があります ( GitHub からダウンロードしました)。

<script src="ui-utils.jq.js"></script>

モジュールを AngularJS にロードします。次に例を示します。

var app = angular.module('myApp', ['ui.jq']);

次に、HTML マークアップでディレクティブを使用します。

<input type="text" ui-jq="inputmask" ui-options="'99/99/9999', { 'placeholder': 'dd/mm/yyyy' }" />
于 2014-03-17T15:26:10.550 に答える