2

状況：

その要素をテンプレートにラップする属性ディレクティブがあります。ここにあります：

app.directive("myCustomInput", function(){
  return{
    restrict: "A",
    replace: true,
    scope:{},
    transclude: "element",
    template: "<div class='input-wrap'>"+
    "<div ng-transclude></div>"+
    "<i class='glyphicon glyphicon-chevron-down'></i>"+
    "</div>"
  }
});

そして、私はそれを次のように使用します：

<input my-custom-input ng-model="data.input" type="text" />

問題：

ng-model動作しません

ここにプランカーがあります

4

1 に答える 1

1

おそらくバグに遭遇した可能性があります。これは、優先順位とディレクティブの処理順序の問題です。ディレクティブの優先度を ng-model よりも高く設定します。1.2 v を使用する場合、ng-model のデフォルトの優先順位は で0あり、1.3 バージョンng-modelでは優先順位が1です。ng-modelしたがって、ディレクティブのレンダリング前に入力を処理する前にディレクティブとトランスクルージョンが発生するように、ディレクティブの優先度を ng-model よりも高くします。

.directive("myCustomInput", function(){
  return{
    restrict: "A",
    replace: true,
    scope:{},
    priority: 1, //Here set the priority
    transclude: "element",
    template: "<div class='input-wrap'>"+
    "<div ng-transclude></div>"+
    "<i class='glyphicon glyphicon-chevron-down'></i>"+
    "</div>"
  }
});

デモ

于 2014-12-25T19:45:40.503 に答える