1

編集:これは実際に機能することがわかりました。インスペクターの「モデル」属性の背後にあるコンテンツが表示されないだけです。私が使用していた特定のデータ ポイントにはコンテンツがなかったので、私はそれに気づきませんでした。助けてくれたすべての人に感謝します。

そのため、非常に冗長なネストされたディレクティブ構造を作成することで、フォーム構造をよりシンプルにしようとしています。私はこれを達成するためにかなり基本的なAngularコードを使用していますが、何らかの理由で、子ディレクティブの属性の値として親からの属性を使用することは機能しません(説明するために以下のコードは、いくつかの独自の単語を変更する必要がありましたが、本質的には同じ）。私は何を間違っていますか？

親 HTML ディレクティブの呼び出し:

<field-label project-for="projectName" project-model="data.product.projectName">Project Name</field-label>

指令コード:

app.directive("fieldLabel", function() {
  return {
    restrict: "E",
    transclude: true,
    scope: { model: '=projectModel', for: '@projectFor' },
    templateUrl: 'views/products/label.html',
  };
});

編集：リクエストにより、ここで使用されている他のディレクティブ：

app.directive("projectOtherView", function() {
  return {
    restrict: "E",
    scope: { field: '=projectOtherViewModel' },
    templateUrl: 'views/products/XXX.html',
  };
});

テンプレート HTML

<div class="col-sm-2 text-right">
  <label for="{{for}}" class="control-label" ng-transclude></label>
  <project-other-view project-other-view-model="model"></project-other-view>
</div>

「for」は正常に機能しますが、「モデル」はそれ自体を通過するだけであり、本来あるべき姿（最初に通過したモデル名）ではありません。

4

2 に答える 2

0

私のコメントのとおりです。定義したもの以外は何も表示されないという事実、この場合は「モデル」という単語は問題ありませんが、親モデルに接続されています。したがって、式 {{field}} を子テンプレートに入れると、モデル内の双方向バインディングにアクセスできるようになります。したがって、モデルの階層は次のようになります。

level 1: data.product.projectName (binding to next level: project-model="data.product.projectName")
    level 2: projectModel (binding to next level: model: '=projectModel')
        level 3: model (binding to next level: project-other-view-model="model")
           level 4: projectOtherViewModel (binding to next level: field: '=projectOtherViewModel' )

ハイフンが削除され、CamelCased であるため、テンプレートの「project-model」は JavaScript の「projectModel」になることに注意してください。

実際の例については、 http://plnkr.co/edit/MsAHkTU3KLXWhpplWAPs?p=previewを参照してください。

于 2013-10-22T09:58:21.970 に答える
0

問題を再現する jsfiddle を作成できますか? あなたの問題はこれに関連していると感じています

于 2013-10-18T14:17:37.137 に答える