Angular 指令中的外部模板 (templateURL) 不起作用

蜻蜓

我正在尝试使用 AngularJS 指令在按钮单击时创建手风琴。我有用于创建手风琴的外部模板。但我无法让它工作。这是代码：

指示：

 (function() {
        'use strict';

        angular.module('accountApp')
        .directive('addSubsite', addSubsite);
        function addSubsite ($compile, $templateRequest){
            var ddo = {
                restrict: 'A',
                link: function(scope, element) {
                    element.bind("click", function(e){
                        $templateRequest("addSubsiteTemplate.html").then(function(html){
                          var template = angular.element(html);
                          $element.append(template);
                          $compile(template)(scope);
                          $element.find(".add-subsites").append(template);  
                       });
                    });
                }
            };
            return ddo;

        }
    })();

索引.html

<button add-subsite type="button" class="btn btn-primary pull-right margin10-b"id="aid-addSubSitebtn">Add Sub-Site</button>
<accordion>
    <accordion-group>
<div class="accordion-heading header">
                <a class="accordion-toggle" id="primary__site__address" data-toggle="collapse" href="#primary__site">
                <h4><span class="pull-left"><i class="icon-minus"></i></span>Business Name (Primary Site)</h4></a>                  
            </div>
      <div class="form-group">
    <label for="exampleInputName2">Name</label>
    <input type="text" class="form-control" id="exampleInputName2" placeholder="Jane Doe">
  </div>
  <div class="form-group">
    <label for="exampleInputEmail2">Email</label>
    <input type="email" class="form-control" id="exampleInputEmail2" placeholder="[email protected]">
  </div>
  <button type="submit" class="btn btn-default">Send invitation</button>
    </accordion-group>    
  </accordion>

模板.html

<accordion>
        <accordion-group>
    <div class="accordion-heading header">
                    <a class="accordion-toggle"data-toggle="collapse" href="#subsite__site">
                    <h4><span class="pull-left"><i class="icon-minus"></i></span>Business Name (SubSite)</h4></a>                   
                </div>
          <div class="form-group">
        <label for="exampleInputName2">Name</label>
        <input type="text" class="form-control" id="exampleInputName2" placeholder="Jane Doe">
      </div>
      <div class="form-group">
        <label for="exampleInputEmail2">Email</label>
        <input type="email" class="form-control" id="exampleInputEmail2" placeholder="[email protected]">
      </div>
      <button type="submit" class="btn btn-default">Send invitation</button>
        </accordion-group>    
      </accordion>

蜻蜓

我改变了我的方法这是示例https://jsfiddle.net/2u7aLg5c/

angular.module('testApp',[])
.controller('TestController', function(){
    const vm = this;
  vm.inputs=[{}];
  vm.myInput = [];
  vm.add = function(){
    vm.inputs.push({})
  }

})

本文收集自互联网，转载请注明来源。

如有侵权，请联系 [email protected] 删除。