0

嗨，我是 AngularJS 的新手，如果这是一个简单的问题，请原谅我。我有一个简单的指令，看起来像这样：

app.directive('myDirective', function() {
    return {
        restrict: 'E',
        transclude: true,
        replace: true,
        template: '<div ng-transclude></div>'
    };
});

理想情况下，我希望使用 ng-repeat 生成使用 ng-transclude 插入到我的 div 中的内容。所以我有一个这样的 HTML 块：

<my-directive>
    <div ng-repeat="item in data">{{item.name}}</div>
</my-directive>

我知道我的数据数组已正确填充在我的控制器中，因为我可以在我的开发工具中看到请求并且我已经记录了我的数据对象。但是，我的页面没有正确生成，当我检查我的页面内容时，我最终得到的结果如下：

<my-directive>
    <!-- ngRepeat: item in data -->
</my-directive>

在 ng-transclude 中使用 ng-repeat 有什么问题吗？我已经搜索过，但似乎找不到答案。谢谢！

编辑：

这是控制器：

app.controller('MyController', ['$scope', function($scope) {
    $scope.data = [{'name': 'Foobar'}];
}]);
4

1 回答 1

0

您的控制器和指令之间可能存在一些范围可见性问题。

看看[这个 jsFiddle]。

var myModule = angular.module('ui.directives', []);
myModule.directive('myDirective', function() {
    return {
        restrict: 'E',
        transclude: true,
        replace: true,
        template: '<div ng-transclude></div>'
    };
});

myModule.controller('myController', function($scope){
    $scope.data = [
        {name: 'foo'},
        {name: 'bar'}
    ];
});

angular.module('myApp', ['ui.directives']);
于 2015-03-03T23:17:32.090 回答