Javascript 使用双向数据绑定的AngularJS指令templateUrl函数

我尝试使用指令参数化页面的模板。 我有一个具有“type”值的对象数组。当类型不同时，我想使用不同的模板

以下是我尝试过的：

指令.js

angular.module('core')
  .directive('mySolutionDisplay', function () {
    return {
      restrict: 'E',
      scope: {
        solution: '='
      },
      templateUrl: function (elem, attr) {
        return 'path/to/template/solution-'+attr.type+'.template.html';
      }
    };
  });

view.html

<div class="row">
  <my-solution-display type="vm.solution[0].type" solution="vm.solution"></my-solution-display>
</div>

我得到以下错误：

angular.js:11706错误：[$compile:tpload]未能加载模板：path/to/template/solution vm.solution[0]。type.template.html

我尝试将

type=“vm.solution[0]。键入“

替换为

type=“{{vm.solution[0].type}}”

，但它只是在错误消息中添加了花括号。

属性（attrs）无法访问范围变量。它们在插值后得到dom值

所以，使用

---

注意

type=“vm.solution[0].type“

如何更改为

type=“{{vm.solution[0].type}}”

您是否尝试过这样做，我认为在type=“”，它不会解析变量名，您可以尝试在其中添加花括号。我已经尝试过了，但它只是在错误描述中添加了花括号

angular.js:11706错误：[$compile:tpload]未能加载模板：path/to/template/solution-{{vm.solution[0]。键入}}}.template.html

是的，忽略我的答案。看来那是不可能的。请参阅错误：。看一看：寻找解决这个问题的另一种方法。