Question

所以我想说我正在编写一个自定义指令，将模板加载到div中。我的自定义指令名为loadClickedTpl。单击loadClickedTpl后，应该读取该属性并将模板加载到#target。

到目前为止，我的HTML看起来像这样：

 <html np-app="mymodule">
      <head>...</head>
      <body>

           <a loadClickedTpl tplSrc="myTpl" > Click Me to load template </a>

           <div id="target" ng-include src="clickedTpl"></div>

           <script type="text/ng-template" id="myTpl">
                <h1>Loaded</h1>
           </script>

      </body>
 </html>

问题是将clickedTpl var设置为指向模板。如果它在html中如此完成<div id="target" ng-include src="'myTpl'"></div>它可以正常工作，那么以编程方式进行操作证明是一个挑战。这是我到目前为止所尝试的：

angular.module('loadATpl').directive 'loadClickedTpl', ->
     (scope, element, attrs) ->
           element.bind 'click', -> 
                # does not work
                scope.clickedTpl = attrs.tplSrc

                # also does not work
                angular.injector(['ng']).invoke ($rootScope) ->
                       $rootScope.clickedTpl = attrs.tplSrc

                # obviously does not work
                clickedTpl = atts.tplSrc

angular.module('mymodule', ['loadATpl'])

点击绑定确实有效，但这就结束了。

Answer 1

以下是工作示例：http://plnkr.co/edit/8BNYr9J8g6tRLMo8VdPi?p=preview

你需要使用attrs作为'load-clicked-tpl'（连字符表达式）用于角度指令。

角度范围混乱

1 个答案: