AngularJS指令不显示数据

Question

我有一个AngularJS指令，我的目标是使用自定义指令（来自工厂）循环数据。

$(function(){    
    $('.datepicker').datepicker({
        dateFormat: "D dd/mm/yy"        
    });    
});

模板

 app.directive('exampleDirective', function ($scope, TestProvider, TestFactory) {
return {
    restrict: 'E',
    template: '<span></span>',
    replace: true,
    link: function(scope, elm, attrs) {
        // loop thru data and display
        console.log(TestFactory.dataReturn());                       
    }
};
})

AngularJS代码：

<div ng-app="myApp" ng-controller="myCtrl" >
    <div >


    </div>


    <hello></hello>

    <table class="table table-striped">
        <thead>
            <tr>
                <th>Firstname</th>
                <th>Lastname</th>

            </tr>
        </thead>
        <tbody>
            <tr ng-repeat="dat in dunData">
                <td>{{dat.Name}}</td>
                <td>{{dat.Surname}}</td>

            </tr>

    <example-directive>{{message}}</example-directive>  
        </tbody>
    </table>
</div>

http://jsfiddle.net/Jack113/66ymvvgy/

为什么数据不会出现在该指令的模板中？

Answer 1

指令功能在config＆amp; amp;之后立即执行。运行阶段被执行。

<强>循环

1. 配置阶段
2. 运行阶段
3. 指令功能
4. 其他执行。

Demo以上序列

你不能在指令函数中注入$scope依赖，$scope可以在link / controller函数中使用它在编译时无法使用。

<强>代码

app.directive('exampleDirective', function (TestProvider, TestFactory) {

Working Fiddle