5

私は最初の AngularJS プロジェクトに取り組んでいます。今まで大好きだったのに、もうやめました。

私のプロジェクトは、現在のルートに基づいて個別の HTML テンプレート/部分が取り込まれた単一の ng-view を index.html に持つように構成されています。

パーシャルの 1 つで、 jQuery DateFormat プラグインを使用して、角度式を使用してテンプレート/パーシャルに解析される SQLite 日時文字列をフォーマットしたいと思います。

{{ find.addDate }}

index.html に script タグを付けてプラグインを含めました。そこから、テンプレート/部分的に次のようなことを行うのと同じくらい簡単だと思いました。

{{ $.format.date(find.addDate, "dd/MM/yyyy") }}

または多分:

{{ angular.element.format.date(find.addDate, "dd/MM/yyyy") }}

それは機能していません (一部の人にとっては明らかな理由だと思います) が、コンソールにエラーはなく、どのようにアプローチするかについてかなり困惑しています。「angular のサードパーティ スクリプト」や「jquery プラグイン angularjs」などの用語を使用していくつかのグーグルを実行しましたが、これを正しい方法で達成する方法に関する最近のコード例を見つけることができません。

angular.widget を使用している古いコードをいくつか見つけましたが、1.0 以降のリリースでは非推奨になっているようです。ディレクティブを使用する必要があると思いますが、正確にはわかりません。

説明や簡単な例をお願いします。どうもありがとう!

4

1 に答える 1

10

問題は、テンプレートで {{expression}} を実行すると、現在のスコープで評価されることです。

たとえば、次のコントローラーがある場合:

function MyCtrl($scope) {
    $scope.find = {
        addDate: 2030
    };
}

{{find.addDate}}実際にはそれを探して$scope.find.addDate評価します (この場合は 2030 を返します)。

したがって、実行しようとすると{{ $.format.date(find.addDate, "dd/MM/yyyy") }}、Angular は $scope.$.format.date(find.addDate, "dd/MM/yyyy")存在しない を探します。

代わりに、コントローラーで関数を使用して、次のようなことを試してください。

   function MyCtrl($scope) {
        $scope.find = {
            addDate: 2030
        };
        $scope.formatDate = function(input, format) {
            return $.format.date(input, format);
        }
    }

そして、あなたができるあなたのhtmlで行うことができます: {{formatDate(find.addDate, "dd/MM/yyyy")}}.

入力を受け取って変更するだけなので、マークアップでフィルターとして評価することもできます。{{find.addDate | formatDate:"dd/MM/yyyy"}}

于 2012-07-08T02:44:29.427 に答える