使用 innerHTML 注入一个 angluarjs 指令元素

Question

我正在为以下问题寻求帮助：

我有一个指令调用 "hello" :

.directive('hello', function () {
    return {
        restrict: 'E',
        templateUrl: 'js/dashboard/templates/hello.html'
    }
});

这是模板（非常简单，用于测试）：

<h1>Hello world</h1>

我有一个控制器，我试图在其中注入这个指令：

(...)
cell = document.getElementById("body");
cell.innerHTML = "<hello></hello>";
(...)

我的问题： "hello" 元素已正确插入 html 页面，但未显示模板中的 "hello word" 消息

如果我直接将元素放在 html 页面中，它会起作用...

能否请您帮助我理解问题并找到解决方案。

谢谢

Answer 1

更像这样：http://plnkr.co/edit/uR6ViwNaaVZijSElrTJz?p=preview

var app = angular.module('plunker', []);

app.controller('MainCtrl', function($scope) {
  $scope.name = 'World';
}).directive('hello', function () {
    return {
        restrict: 'E',
        templateUrl: 'hello.html'
    }
});


  <body ng-controller="MainCtrl">
    <p>Hello {{name}}!</p>

    <hello></hello>
  </body>

使用 innerHTML 注入一个 angluarjs 指令元素

Inject a angluarjs directive element with innerHTML

innerhtml

angularjs

angularjs-directive