1

我正在使用带有 angualrJS 的 Goldenlayout。我面临以下异常：

Error: ng:btstrpd App Already Bootstrapped with this Element

在执行这行代码时

myGoldenLayout.on('initialised', function () {
 angular.bootstrap(angular.element('#layoutContainer')[0], ['app']);
});

原因是，我的 HTML 中已经有 ng-app，那么当我已经有 ng-app 时，如何注册黄金布局？

https://github.com/codecapers/golden-layout-simple-angular-example/issues/1

4

1 回答 1

1

好吧，Golden Layout 官方文档推荐使用手动引导，但是如果你想继续使用ng-app，那么你必须确保你的组件（模板）是由 Angular 编译的（通过$compile）。这是一个如何做到这一点的例子：

angular.module('someApp') // your main module name here
  .run(function ($compile, $rootScope) {
    myLayout.registerComponent('template', function( container, state ){
        var templateHtml = $('#' + state.templateId).html();
        var compiledHtml = $compile(templateHtml)($rootScope);
        container.getElement().html(compiledHtml);
    });


    myLayout.on( 'initialised', function() {
        $rootScope.$digest(); // Golden Layout is done, let Angular know about it
    });
  });

// somewhere...
myLayout.init();

基本上，与您提供的存储库中的示例的主要区别在于，我们不只是附加原始 HTML，$compile而是使用 Angular，所以现在它知道设置绑定并保持 html 更新。

这应该允许您继续使用ng-app而不是手动引导。

于 2016-12-09T18:10:57.453 回答