Question

在AngularJS指令中，指令有一个如下模板：

app.directive('exampleDirective', ['$http',
function($http) {

    return {
        restrict : 'A',
        template : '<div>Example Template Content</div>',
        link : function(scope, element, attrs, controller) {
        }
    };
}]);

是否有办法根据发生的操作动态更改模板，例如单击更改指令模板？

Answer 1

您有很多选择取决于您的需求，plunker：

app.directive('mydir',function($compile){
  return {
    restrict : 'A',
    template : '<div>Example Template Content</div>',
    link : function(scope, element, attrs, controller) {

      var newTemplate = "<div>changed</div>";

      // if you need to compile:
      newTemplate = angular.element(newTemplate);
      $compile(newTemplate)(scope);

      element.on('click', function(){
        element.empty();
        element.append(newTemplate)
      });
    }    
  }
})

如果你可以更具体，我会举出更多例子。

更新指令的模板AngularJS

1 个答案: