把手拉到角度
把手拉到角度
提问于 2013-01-12 03:57:09
到目前为止，我一直在为javascript模板使用handlebars。然而，我想使用angularJs。我想知道是否有人可以建议一个过渡到angularjs的好方法。例如，如果我有一个模式。我创建了一个handlebars模板，将其包含在页面的底部，然后获取js func (rest api)中的数据，并告诉handlebars模板将编译后的数据放入div等。
下面是一个示例js函数，它使用handlebars来显示模态中的内容。
$('[data-toggle="tabularmodal"]').click(function(e)
{
e.preventDefault();
var data_uri = $(this).attr('data-uri');
var data_title = $(this).attr('data-header');
var data;
var source = $('#tabular-ep-data').html();
var template = Handlebars.compile(source);
$('.modal-header h3').html(data_title);
$.getJSON(data_uri, function(json)
{
$('.modal-body').html(template(json));
});
$('#myModal').modal('show');
});我想要一些关于如何以angularjs的方式实现这一点的建议。在handlebars中，我必须在页面底部包含javascript模板，等等。我想远离这一点。
回答 1
Stack Overflow用户
回答已采纳
发布于 2013-01-12 04:33:47
在Angular中，你可以创建一个directive，例如modal，它可以简单地放在任何标签上，如下所示：
<button modal="path/to/partial">Open modal</div>甚至是
<modal template-url="path/to/partial">Open modal</modal> 如您所见，它非常灵活。深入理解指令需要一些时间，但是一旦你理解了，它们就非常强大。对于您想要操作DOM的所有东西，指令就是答案。
在指令中，您可以注入服务，这可以使工作变得更容易。例如，$http可用于通过异步请求获得部分。另一个有用的服务是$compile，它准备模板，因此可以将其插入到DOM中。
下面是一个modal指令的示例(但可能性几乎是无限的)：
var app = angular.module('app', []);
app.directive('modal', ['$http', '$compile', function($http, $compile) {
return {
restrict: 'E',
link: function(scope, elm, attrs) {
element.on('click', function(e) {
$http.get(attrs.templateUrl).success(function(template) {
var html = $compile(template)(scope);
// insert html somewhere
scope.$apply();
});
});
}
};
}]); 页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/14285714
复制相关文章
相似问题
腾讯云开发者
