Question

这是我的第一个问题，所以我希望我可以解释一下情况 angularJs文档here讨论了将指令templateUrl作为动态返回的函数。还有一个Plunkler现场演示here。

.directive('....', function() {
   return {
     templateUrl: function(elem, attr){
       return **.... scope.Somthing ...**;
     }
   };
 });

该函数不采用范围参数，这是主要问题

到目前为止，我发现的唯一方法是动态设置TemplateUrl与指令范围的相关性是这样的

.directive('....', function() {
  return {
    link: function (scope, element, attrs) {
      scope.getTemplateUrl = function () {
        return **.... scope.Somthing ...**;
      };
    },
    template: '<ng-include src="getTemplateUrl()"/>'
  };
});

另一种解决方案是

.directive('....', function() {
  return {
    controller: function ($scope) {
      $scope.getTemplateUrl = function () {
        return **.... scope.Somthing ...**;
      };
    },
    template: '<ng-include src="getTemplateUrl()"/>'
  };
});

我的第一个问题是这看起来像问题的补丁

我的第二个问题是必须在指令中构建html字符串。

还有其他方法可以实现吗？

Answer 1

让我们分解您的问题，解决2个问题：D

第一个问题是关于在js中存储模板。

使用$ templateCache和injecting

可以解决此问题

<script id="myTemplate.html" type="text/ng-template"> <div> SOME MARKUP <div> </script>

Here您可以阅读有关此内容的更多信息

第二个问题是关于动态模板。所以有2种解决方案（据我所知：D）您已经提到的第一个解决方案 - 使用ng-include。

第二个解决方案是使用$compile动态编译带有angular指令的html。

第一种解决方案稍微好一些，因为在第二种情况下，您必须始终记住内存泄漏。点击此处查看更多info和here

如何使用scope动态更改angularjs自定义指令templateUrl

1 个答案: