Question

我试图将ng-repeat本地对象传递给指令。我需要在指令控制器中访问该对象的数据。我对iso-lated scope和控制器范围感到困惑。为什么它不起作用。

Demo弄清楚我在尝试什么

HTML

<div ng-app="my-app" ng-controller="MainController">

    <div ng-repeat="document in documents">
        <name-row 
            document-element="document">
        </name-row>
    </div>
</div>

指令

module.directive('nameRow', function() {
    return {
        restrict: 'E',
        replace: true,
        scope: {
            documentElement : '=document',

        },
        controller: function($scope) {
            console.log($scope.documentElement);
        },
        template:
'        <ul>' +      
'            <li>' +
'                <a>' +
'                    {{documentElement.targetPrice}}' +
'                </a>' +
'            </li>' +
'        </ul>'
    };
});

我只想了解它为什么不起作用。我不想做任何其他选择，比如在链接功能等中访问它。

Answer 1

您使用了属性=document的别名，您的属性应为document而不是document-element。

<div ng-repeat="document in documents">
    <name-row 
        document="document">
    </name-row>
</div>

其他方式是你可以在隔离的属性声明中删除属性的别名。

scope: {
   documentElement : '=', //just have `=` instead of `=document`
},

Answer 2

指令变更。变量名称错误

module.directive('nameRow', function() {
    return {
        restrict: 'E',
        replace: true,
        scope: {
            documentElement : '=documentElement',

        },
        controller: function($scope) {
            console.log($scope.documentElement);
        },
        template:
'        <ul>' +      
'            <li>' +
'                <a>' +
'                    {{documentElement.targetPrice}}' +
'                </a>' +
'            </li>' +
'        </ul>'
    };
});

将ng-repeat本地对象传递给指令控制器不起作用

2 个答案: