0

アプリケーション全体で ModelState エラー (MVC Web API からスローされたもの) を表示するために使用するカスタム ディレクティブを作成しましたが、カスタム ディレクティブによって生成された html 部分にエラーは表示されませんが、エラー div はメッセージなしで表示されます。私を助けてください。

cmApp.directive("modelError", function () {
    return {
        restrict: 'E',
        replace: true,
        scope: {
           errors: '@'
        },
        template: '<div class="row">' +
                    '<br />' +
                    '<div class="span10">' +
                        '<div class="alert-error alert" ng-show="errors" ng-switch="errors.length">' +
                          '<strong>Error!</strong>' +                              
                          '<ul ng-switch-default>' +
                            '<li ng-repeat="error in errors">{{error}}</li>' +
                          '</ul>' +
                        '</div>' +
                    '</div>' +
                '</div>',
    };
});

HTML コード:

<model-error errors="{{modelErrors}}"></model-error>

コントローラーコード:

$scope.modelErrors = validationService.getModelErrors(response);

「エラー！」しか表示されません。div ですが、エラー メッセージではありません。

4

1 に答える 1

1

属性値を渡す前に補間する必要はありません。

<model-error errors="modelErrors"></model-error>

また、分離スコープ タイプを次のように変更してみてください=。

scope: {
       errors: '='
},

安定したディレクティブ ドキュメントから:

スコープ - に設定されている場合:

true - このディレクティブの新しいスコープが作成されます。同じ要素の複数のディレクティブが新しい​​スコープを要求する場合、新しいスコープは 1 つだけ作成されます。テンプレートのルートは常に新しいスコープを取得するため、新しいスコープ ルールはテンプレートのルートには適用されません。

{} (オブジェクト ハッシュ) - 新しい「分離」スコープが作成されます。'isolate' スコープは、親スコープから原型的に継承しないという点で、通常のスコープとは異なります。これは、親スコープのデータを誤って読み取ったり変更したりしてはならない、再利用可能なコンポーネントを作成する場合に役立ちます。'isolate' スコープは、親スコープから派生した一連のローカル スコープ プロパティを定義するオブジェクト ハッシュを取ります。これらのローカル プロパティは、テンプレートの値のエイリアスに役立ちます。ローカルの定義は、ソースへのローカル スコープ プロパティのハッシュです。

@ または @attr - ローカル スコープ プロパティを DOM 属性の値にバインドします。DOM 属性は文字列であるため、結果は常に文字列になります。属性名が指定されていない場合、属性名はローカル名と同じであると見なされます。スコープのウィジェット定義: { localName:'@myAttr' } を指定すると、ウィジェット スコープ プロパティ localName は、hello {{name}} の補間値を反映します。name 属性が変更されると、ウィジェット スコープの localName プロパティも変更されます。名前は、(コンポーネント スコープではなく) 親スコープから読み取られます。

= または =attr - attr 属性の値を介して定義された name のローカル スコープ プロパティと親スコープ プロパティとの間の双方向バインディングを設定します。属性名が指定されていない場合、属性名はローカル名と同じであると見なされます。スコープのウィジェット定義: { localModel:'=myAttr' } を指定すると、ウィジェット スコープ プロパティ localModel は、親スコープの parentModel の値を反映します。parentModel への変更は localModel に反映され、localModel の変更は parentModel に反映されます。

& または &attr - 親スコープのコンテキストで式を実行する方法を提供します。属性名が指定されていない場合、属性名はローカル名と同じであると見なされます。指定されたスコープのウィジェット定義: { localFn:'&myAttr' } の場合、分離スコープ プロパティ localFn は count = count + value 式の関数ラッパーを指します。分離されたスコープから式を介して親スコープにデータを渡すことが望ましい場合がよくあります。これは、ローカル変数名と値のマップを式ラッパー fn に渡すことで実現できます。たとえば、式が increment(amount) の場合、localFn を localFn({amount: 22}) として呼び出して金額の値を指定できます。

于 2013-10-29T23:41:38.423 に答える