如何在angular1中添加动态数据与动态数据？

Question

基本上我想要实现这样的场景：

https://i.stack.imgur.com/LLTcK.png

我的研究使我$编译，$ trustAsHtml，最后指令。 在$ compile和$ trustAsHtml我只能附加静态模板或只能html，但不能使用动态的东西，例如ui-sref，ng-click等。 所以，我试图创建指令，它不工作，我也无法单击时添加多个模板。

控制器：

app.controller('Ctrl', ['$rootScope', '$scope',function ($rootScope, $scope) 
{  
    $rootScope.enableDirective=false;   
    if(userHasOneApp){// checking some at least one app then only do action 
    $rootScope.appicon="img_url"; // data which i am passing 
    $rootScope.appname="App_name"; // data which i am passing 
    $rootScope.enableDirective=true; 
} 
}]); 

定制指令：

app.directive('headerTemplate', function() { 
    return {    
     template:'<a ui-sref="/event" ng-click="editIt()">' 
       +'<img src="{{appicon}}"></a>' 
       +'<span>{{appname}}</span>', 
     scope:{         
      appname:'=', 
      appicon:'=' 
     }    
     }; 
    }); 

部首视图：

<div> class="headerdiv"> 
    <ul ng-if="enableDirective"> 
     <li header-template appicon="appicon"> 
     </li>      
    </ul> 
</div> 

主视图：

<div> class="maindiv"> 
    <ui-view></ui-view> <!--basically I want to append template here --> 
    <button>Add next template</button> 
</div> 

我在哪里做错了？

Answer 1

那么我面临同样的问题 看看下面的链接 这一定会帮助你。

我已经实现了这一点，它在我的情况下工作，在那里需要即指令延迟加载时，我想成为一个指令

https://www.codeproject.com/Articles/838402/Lazy-loading-directives-in-AngularJS-the-easy-way