AngularJS 升级(1.5 到 1.6,1.7)使指令范围绑定未定义 [英] AngularJS Upgrade (1.5 to 1.6,1.7) Makes directive scope bindings undefined

问题描述

我有以下代码:

angular
  .module('myApp')
  .directive('layout', function () {
      return {
          restrict: 'E',
          template: '<div ng-include="layoutCtrl.pageLayout"></div>',
          controller: 'LayoutController',
          controllerAs: 'layoutCtrl',
          bindToController: true,
          scope: {
              pageLayout: '=',
              pageConfiguration: '=',
              isPreview: '='
          }
      };
  });

angular
  .module('myApp')
  .controller('LayoutController', LayoutController);

function LayoutController($scope, LayoutDTO, LayoutPreviewDTO) {
    var self = this;
    self.layoutDTO = LayoutDTO;
    self.layoutPreviewDTO = LayoutPreviewDTO;
    var test = $scope;

    if(self.isPreview)
        self.layoutModel = new self.layoutPreviewDTO(self.pageConfiguration);
    else
        self.layoutModel = new self.layoutDTO(self.pageConfiguration);
}


<div>
    <layout page-layout="ctrl.layoutTemplateUrl" page-configuration="ctrl.pageConfiguration" is-preview="false"></layout>
</div>

在 angular 1.5.3 版本中，这按预期工作，我的控制器中的变量带有值.现在，由于我升级到 1.6.x，self.pageConfiguration 现在未定义.

Nothing has changed except for the angular version.

除了有角度的版本外，没有任何变化.

How do I get a handle on the values passed into the directive in my controller?

如何处理传递给控制器​​中指令的值?

解决方案

推荐答案

AngularJS 团队建议将依赖于作用域绑定的控制器代码移到 $onInit 函数中.

function LayoutController($scope, LayoutDTO, LayoutPreviewDTO) { var self = this; this.$onInit = function () { // bindings will always be available here // regardless of the value of `preAssignBindingsEnabled`. self.layoutDTO = LayoutDTO; self.layoutPreviewDTO = LayoutPreviewDTO; var test = $scope; if(self.isPreview) self.layoutModel = new self.layoutPreviewDTO(self.pageConfiguration); else self.layoutModel = new self.layoutDTO(self.pageConfiguration); }; }

<块引用>

$编译:

$compile:

由于 bcd0d4，控制器实例上的预分配绑定被禁用默认.仍然可以重新打开它，这在迁移过程中应该会有所帮助.预分配绑定已被弃用，并将在未来版本中移除，因此我们强烈建议您尽快迁移您的应用程序，不要依赖它.

Due to bcd0d4, pre-assigning bindings on controller instances is disabled by default. It is still possible to turn it back on, which should help during the migration. Pre-assigning bindings has been deprecated and will be removed in a future version, so we strongly recommend migrating your applications to not rely on it as soon as possible.

依赖于绑定存在的初始化逻辑应该放在控制器的$onInit() 方法中，保证总是在绑定被分配后被调用.

Initialization logic that relies on bindings being present should be put in the controller's $onInit() method, which is guaranteed to always be called after the bindings have been assigned.

-- AngularJS 开发人员指南 - 从 v1 迁移.5 到 v1.6 - $compile

<小时>

更新

$compileProvider.preAssignBindingsEnabled 标志已从 AngularJS V1.7 中删除.

---

UPDATE

The $compileProvider.preAssignBindingsEnabled flag has been removed from AngularJS V1.7.

AngularJS 团队强烈建议您尽快迁移您的应用程序，不要依赖它. AngularJS V1.6 将于 2018 年 7 月 1 日停产.

The AngularJS team strongly recommends migrating your applications to not rely on it as soon as possible. AngularJS V1.6 goes end-of-life on 1July2018.

来自文档:

由于 38f8c9，构造函数中不再提供指令绑定.

Due to 38f8c9, directive bindings are no longer available in the constructor.

以前，支持 $compileProvider.preAssignBindingsEnabled 标志.该标志控制绑定是在控制器构造函数中可用还是仅在 $onInit 钩子中可用.绑定现在在构造函数中不再可用.

Previously, the $compileProvider.preAssignBindingsEnabled flag was supported. The flag controlled whether bindings were available inside the controller constructor or only in the $onInit hook. The bindings are now no longer available in the constructor.

要迁移您的代码:

• 如果您指定了 $compileProvider.preAssignBindingsEnabled(true)，您需要先迁移您的代码，以便可以将标志翻转为 false." 中提供了有关如何执行此操作的说明从 1.5 英寸指南迁移到 1.6 英寸指南.然后，删除 $compileProvider.preAssignBindingsEnabled(true) 语句.

• If you specified $compileProvider.preAssignBindingsEnabled(true) you need to first migrate your code so that the flag can be flipped to false. The instructions on how to do that are available in the "Migrating from 1.5 to 1.6" guide. Afterwards, remove the $compileProvider.preAssignBindingsEnabled(true) statement.

—AngularJS 开发者指南 - 迁移到 V1.7 - 编译>

注意:

2018 年 7 月 1 日，对 AngularJS 1.6 的支持结束.如需更多信息，请参阅AngularJS MISC - 版本支持状态.

这篇关于AngularJS 升级(1.5 到 1.6,1.7)使指令范围绑定未定义的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！