Question

编辑：事实证明这实际上有效，它只是没有显示检查器中“模型”属性背后的内容。我没有注意到它，因为我正在使用的特定数据点没有内容。 Facepalm 感谢所有帮助过的人。

所以我试图通过创建一个非常详细的嵌套指令结构来使我的表单结构更简单。我正在使用相当基本的角度代码来实现这一点，但由于某种原因，使用父节点中的属性作为子指令属性的值不起作用（下面的代码解释，必须更改一些专有单词，但它本质上相同）。我做错了什么？

父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'工作正常，但'模型'只能通过它自己，而不是它应该是什么（我在开始时经过的模型名称）。

Answer 1

你能创建一个复制问题的jsfiddle吗？我觉得您的问题与this

有关

Answer 2

根据我的评论。事实上，除了你定义的东西之外，它没有显示任何东西，在这种情况下，“模型”这个词很好，它仍然连接到父模型。因此，如果您将表达式{{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。

将指令属性作为嵌套指令属性值调用

2 个答案: