为什么我的$scope不反映正在初始化的控制器？

Question

>问题：

为什么{{ name }}会导致空白？

普伦克：

http://plnkr.co/edit/32t8u4VL9BiuhHcC80LF?p=preview

脚本：

var app = angular.module('app', []);
app.controller('MainCtrl', function($scope) {
  $scope.name = 'World';
});
app.directive('portal', function () {
  return {
    restrict: 'E',
    transclude: true,
    template: '<div><span>Header</span><div ng-transclude></div><span>Footer</span></div>'
  }
})

.HTML：

<portal ng-app="app" ng-controller="MainCtrl">
  <p>Hello {{ name }}, let's see if Angular is working at all... 1 + 2 = {{ 1 + 2 + '!' }}</p>
</portal>

Answer 1

将

ng-app和mg-controller放在父<div/>上，事情将按预期工作。

<div ng-app="app" ng-controller="MainCtrl">
    <portal>
      <p>Hello {{ name }}, let's see if Angular is working at all... 1 + 2 = {{ 1 + 2 + '!' }}</p>
    </portal>
</div>

Answer 2

将门户更改为div，您将看到是您的指令不起作用，而不是您的控制器。

这有效：

  <div ng-app="app" ng-controller="MainCtrl">
    <portal>
      <p>Hello {{ name }}, let's see if Angular is working at all... 1 + 2 = {{ 1 + 2 + '!' }}</p>
    </portal>
  </div>