指令不起作用？

Question

我们在指令部分设置限制AE。在HTML中我厌倦了下面的代码。它无法正常工作。

<hello-world>
    <input type="text" ng-model="color" placeholder="Enter a color" />
 </hello-world> .

但我尝试下面的code.it工作正常。

<input type="text" ng-model="color" placeholder="Enter a color" />
  </hello-world>.

上述指令代码有什么区别。我是指令代码。

app.directive('helloWorld', function() {
  return {
    restrict: 'AE',
    replace: true,
    template: '<p style="background-color:{{color}}">Hello World',
    link: function(scope, elem, attrs) {
      elem.bind('click', function() {
        elem.css('background-color', 'red');
        scope.$apply(function() {
          scope.color = "red";
        });
      });
      elem.bind('mouseover', function() {
        elem.css('cursor', 'pointer');
      });
    }
  };
});