Question

我现在已经经历了大约一个月的角度我熟悉它的所有核心方面，但我遇到了一个我不明白的问题。
我有2个指令 - 一个是父，另一个是孩子。
孩子从父母那里得到3个参数 - 其中2个通过，但是当我调试并检查第3个时 - 它是未定义的。

儿童指令 -

angular.module('management').directive('timeFrame', function() {
return {
    restrict: 'E',
    templateUrl: '/Client/directives/timeFrame/timeFrame.html',
    scope: {
        timeFrame: '=',
        deleteFrameFunction: '&',
        index: '@'
    }

以下列方式使用child指令：

<div class="list-group-item" ng-repeat="timeFrame in ad.timeFrames">
  <time-frame index="{{$index}}" timeFrame="timeFrame" deleteFrameFunction="(function() {doStuff;})"></time-frame>
</div>

所有参数都通过，但是未定义的timeFrame 我尝试更改将其传递给{{timeFrame}}或：ad.timeFrames[{{$index}}]的方式以及其他许多失败的方法。

我需要使用双向绑定传递此参数，因为该指令将修改它并且父指令必须知道它。

我没有做过与以同样方式为我工作的其他指令有所不同的东西。

任何帮助/解释将不胜感激，
提前致谢。

Answer 1

您的命名约定不正确。绑定到指令范围的属性时，适用于指令的连字符命名约定的camelCase适用。

time-frame="timeFrame"

但是，由于这会与您的指令名称冲突，因此您应该使用不同的范围属性名称。

指令：

scope: {
    boundTimeFrame: '=',
    deleteFrameFunction: '&',
    index: '@'
}

模板：

<time-frame index="{{$index}}" bound-time-frame="timeFrame" 
    delete-frame-function="(function() {doStuff;})"></time-frame>

AngularJS双向数据绑定将无法正常工作

1 个答案: