自定义指令内的自定义指令不会触发

Question

我有一个指令，根据数据加载模板，现在当我加载模板时，它恰好有另一个指令，它只是不呈现。

我尝试过pririty，transclude，replace和任何其他可能的开关但没有成功。

知道为什么这个在root html文件上工作但在另一个指令里面没有？

这是吸虫。

http://plnkr.co/edit/ORF5zXJGFb3Z9Kb0mNyK?p=preview

Answer 1

它不起作用的原因是因为tile指令创建了一个隔离范围，这意味着tile指令的子节点无法访问任何父范围变量。由于'basicAreaChart'变量是在MainCtrl中定义的，因此模板tile2.html无法访问它

至于如何解决这个问题，你可以采取各种方式。最简单的方法是将构建图表所需的数据抽象为服务：

app.factory('ChartData', function(){
    return {
        get : function(id){
            return //Your data based on logic
        }
    }
});

app.directive('chart', function(ChartData){
    return {
        //Configuration properties
        scope : {
            chartDataKey : '@'
        },
        link : function(scope, element, attrs){
            var data = ChartData.get(scope.chartDataKey);
            //More logic
        }
    }
});