javascript - Angularjs - 动态模板 URL

标签 javascript angularjs angularjs-directive

我有一个指令,我希望能够在某些逻辑上加载不同的模板。

在下面的示例中,“类型”是范围内的一个变量,我希望将其传递给指令以构建指令模板的 URL。

<direct type="{{type}}"></direct>

var direct = function () {
  return {
  restrict: 'E',
  templateUrl: function(tElement, tAttrs) {
    console.log(type);
    return 'resources/' + tAttrs.type + '.html';
  }
 };
};

未评估类型,而是在 tAttrs 中传递实际字符串“type”。你知道我可能会错过什么吗?

最佳答案

您必须通过直接指令上的隔离范围来执行此操作。

我在这里为您做了一个例子:http://jsbin.com/lagez/1/edit

您可以在示例链接中看到,您必须在范围内指定您想要在指令范围内读取的属性:{ attributeName: '@' }

作用域:{}内的属性名称语法应该是驼峰式大小写,首字母小。例如typeName,并在指令中指定属性名称,例如

关于javascript - Angularjs - 动态模板 URL,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22922672/

相关文章:

javascript - 如何订阅事件流 - 服务器端

javascript - Web 元素的文件夹/目录结构 - 最佳实践

javascript - PHP 没有从 $.ajax 获取 POST 数据

javascript - JS 中的依赖跟踪功能

javascript - 在用户移出该字段之前,正式字段不会显示验证

javascript - Angular 2使用AfterViewInit从文件执行JS

css - 使div元素拉伸(stretch)页面全高

javascript - 在路由更改不起作用后取消angularjs超时

javascript - Angular Material - 如何将自定义指令属性附加到 md-list-item 元素?

angularjs - Angular 包裹分别包含元素?