Несколько приложений Angular JS

Я реализовал два приложения Angular NVD3 для просмотра 2 графиков на моей html-странице. Я прочитал, что мог бы реализовать оба, делая это с помощью ng-модулей вместо ng-app, но как-то это не работает. Не могли бы вы помочь мне?

<div ng-modules="temperatureChart" ng-controller="temperatureCtrl">
    <nvd3 options="options" data="data" class="with-3d-shadow with-transitions"></nvd3>
    <br><a href="http://krispo.github.io/angular-nvd3/" target="_blank" style="float: right;">See more</a>
</div>
<div ng-modules="heatcounterChart" ng-controller="heatingCtrl">
    <nvd3 options="options" data="data" class="with-3d-shadow with-transitions"></nvd3>
    <br><a href="http://krispo.github.io/angular-nvd3/" target="_blank" style="float: right;">See more</a>
</div>

Вот так я и попробовал, но не работает.

Источник

2 ответа

Решение

Чтобы использовать 2 угловых приложения на своей странице, вам не нужно использовать ng-app загрузить ваше приложение. Вместо этого вам следует отложить загрузку через скрипт, который находится в главной оболочке для двух приложений. После того, как вы загрузили оба приложения, скрипты и т. Д., Вы можете использовать angular.bootstrap('document', <ng dependencies array>),

У вас могут возникнуть проблемы с обеспечением правильной последовательности зависимостей для обоих ваших приложений, поскольку у вас могут быть условия гонки, циклические зависимости и т. Д. Подробнее о загрузке вручную - https://docs.angularjs.org/api/ng/function/angular.bootstrap

Источник

Во-первых, вы можете одновременно иметь только одно приложение на своей странице. Во-вторых, нет директивы "ng-modules" (насколько я знаю). Директива, которую вы ищете, это "ng-app"

Если у вас есть несколько модулей, добавьте новый модуль в ваш код, который зависит от всех этих. Этот новый модуль войдет в ваше ng-приложение.

JS:

angular.module("myApp",["temperatureChart","heatcounterChart"]);

HTML:

<body ng-app="myApp">...
Источник
Другие вопросы по тегам