Angularjs 如何绑定到指令属性？
我希望highchart的标题为Angularjs 如何绑定到指令属性？,angularjs,angularjs-directive,Angularjs,Angularjs Directive,我希望highchart的标题为$scope.data.title，但当前属性title将data.title解释为字符串和范围的绑定。我试着在data.title.html周围放置”、{{}，但它不起作用。我想我还错过了别的东西 index.html <test-chart title="{{data.title}}"> <chart-series title="Series 1" type="line"> </chart-series>
$scope.data.titledata.title”、{{} <test-chart title="{{data.title}}">
<chart-series title="Series 1" type="line">
</chart-series>
<chart-series title="Series 3" type="column">
</chart-series>
</test-chart>
<div>
<div id='highchart_container'></div>
<ng-transclude></ng-transclude>
</div>
<body ng-app="docsTabsExample">
<test-chart>
<chart-series title="Series 1" type="line">
</chart-series>
<chart-series title="Series 3" type="column">
</chart-series>
</test-chart>
</body>
</html>
这并没有达到预期效果，但是如果没有
手表 <test-chart title="{{data.title}}">
<chart-series title="Series 1" type="line">
</chart-series>
<chart-series title="Series 3" type="column">
</chart-series>
</test-chart>
<div>
<div id='highchart_container'></div>
<ng-transclude></ng-transclude>
</div>
<body ng-app="docsTabsExample">
<test-chart>
<chart-series title="Series 1" type="line">
</chart-series>
<chart-series title="Series 3" type="column">
</chart-series>
</test-chart>
</body>
</html>
你不必把s.title放在ng repeat中。应该在外面。 以下是一个工作片段：-
var-app=angular.module（“myApp”，[]）；
app.controller（“myCtrl”，函数（$scope）{
});
app.directive（'testChart'，function（）{
返回{
限制：'E'，
是的，
controllerAs:'chartCtrl'，
范围：{
},
控制器：['$scope'，'$element'，'$attrs'，函数图表控制器（$scope，$element，$attrs）{
$scope.data={
标题：“HIGHGRAPH”，
系列：[{
标题：“系列1”，
键入：“行”，
数据：[1,2]
}, {
标题：“系列2”，
类型：'区域'，
数据：[3,5]
}]
}
var hc=Highcharts.chart（‘highchart\u容器’{
标题：{
text:$scope.data.title
}
});
this.addSeries=函数（a）{
hc.addSeries({
姓名：a.头衔，
类型：a.类型，
数据：[1,2,3,4,5,6]
})
};
}],
模板：“这是一张图表
};
})
.directive（'chartSeries'，function（）{
返回{
要求：“^test chart”，
限制：'E'，
是的，
范围：{
标题：“@”
},
链接：函数（范围、元素、属性、chartCtrl）{
chartCtrl.addSeries（attrs）；
},
};
});
\highchart\u容器{
高度：250px！重要；
}
如果标题是chartCtrl的范围变量，我不明白为什么需要数据绑定
这将简单地实现以下目的：
<div>
{{data.title}}
<div id='highchart_container'></div>
<ng-transclude></ng-transclude>
</div>
{{data.title}
通过在对象上添加一个手表解决了这个问题
为什么不做标题：{text:$scope.data.title}
？@devqon我没有试过你的答案是否可行。但是很糟糕solution@devqon如果我只想使用我在范围中设置的对象设置标题，我可以这样做，但我不想这样做。@PresidentCamacho试试我的答案plzI真的不明白为什么要在属性中传递它，因为您已经在指令中得到了@devqon想要说的内容。如果要在attribute中传递某个内容，这是因为我们将从视图中放置某个静态内容，例如：title=“这不是动态的”，对于您的代码来说，这样做没问题。您将标题放置在highchart对象之外。我希望设置text:$attrs.title
。我还注意到，$attrs.title
中有“HIGHGRAPH”值，但该值设置在$attrs
设置之前。因此，如果我在数据上添加了一个手表，我可以将文本：$attrs.title
设置为正确的值。@PresidentCamacho我已经更新了我的答案。检查它是否有用。在示例中，您没有highchart标题。它位于div中-模板内。你可以在整个指令中看到它。当你将鼠标悬停在指令上时，你会看到标题。见plunker@PresidentCamacho这正是你想要的，对吗？我想要这样的东西：但是没有手表。可能吗？区别在于？？因为我想在highchart中设置标题。@PresidentCamacho检查我更新的答案。我查阅了highchart文档，发现了如何做it@JinsPeter完美答案您是否查看了@Jins-Peter-answer。我认为这是正确的解决方案。@dev是的，我做到了，两人都实现了我的目标，但这不是我想要的方式$scope.data只是临时的。指令是静态的，index.htm将不是。建议：不需要的监视程序可能会降低应用程序的性能。