Angularjs 1.3 新控制器作为语法和指令的问题

issue with Angularjs 1.3 new controller as syntax and directive

直到现在我都在使用 Angularjs 1.2 正常的全局控制器语法,但现在我需要移动 1.3 并使用新的控制器作为语法并避免将全局声明作为我们的要求。

现在正在学习中。但是有些我什至无法使其工作的一些简单的基本应用程序。请找到我的Plunker

我的指令中的 <h2> {{ctrl1.item }}</h2>{{$scope.subItem}} 都没有给出预期的输出。任何人都可以帮助我修复 plunker 以输出项目和子项目。也可以为我提供一些很好的参考资料,以使用 1.3 和示例教程等熟悉这种新语法

在你的 plunker 中删除 $curDir

下次尝试使用 chrome 中的控制台或其他方式。出现错误:

Error: [$injector:unpr] Unknown provider: $curDirProvider <- $curDir <- mainCtrl

http://plnkr.co/edit/NrThd1?p=preview

作为旁注:如果您在 HTML 中看到绑定表达式 {{ }},那么通常 AngularJS 在控制台输出中出现错误。

你的指令有问题:

一)

function postLink($scope, $element, $attrs) {
  // This is not valid JavaScript
  template : '<p> I am from New Directive with Item {{$scope.subItem}}</p>';
}

b) 没有 javascript 将该模板附加到元素。所以在它出现之前你什么都看不到:

$element.append(template);

-- 或--

$element.append(angular.element(template));

c) 一起使用指令的 controllerlink 对象是没有意义的 - 使用一个或另一个是一个很好的起点。

d) 如果您使用 controller,则在指令主体内使用绑定表达式 {{ }} 来正常显示数据。另请注意,如果您将控制器用作,请确保这是在您的指令控制器对象中:

function curDirective() {
  return {
      restrict: 'E',
      controller: 'mainCtrl as vm' // <-- see here
  };
}

固定:

http://plnkr.co/edit/AGB5bp?p=preview