UI cant load angular .error >> "Tried to load angular more than once".

Tags: #<Tag:0x00007fddfa8ae780>

Hi all , am doing some work , creating a new angular widget ,and i had activated UI hot Realoading (Module watch). Innitially angular was being loaded sucesfully , However after several Hot reloading , Angular is no longer loaded. Checking the browser console , i see this warning, not so sure if its the main cause . WARNING: Tried to load angular more than once.

Ive tried to only include one single Angular file but i still get the same error.

i have tried a very simple script like below

      <div ng-app = "">
         <p>Enter your Name: <input type = "text" ng-model = "name"></p>
         <p>Hello <span ng-bind = "name"></span>!</p>
      </div>

but it cant also be loaded, yet i can run it independently in the browser(ouside the widget)

cc @dkayiwa @mksd @mddubey

Hi @mozzy

I actually have a question.Which was there in my mind from the very beginning.

I am not a front end dev so I could be wrong

Why we see 3 types of front end frameworks in openmrs ? Angular,Jquery & groovy, React.

@ayesh , the way you fix up our boostrap issues , you seem to be a front end dev :blush:

well , the issue is , front end development is too dynamic ,as compared to back end. So usually as openmrs , we try to cope up as much as possible to the hot cake in the market as far as possible in terms of current frameworks, and thats why we have tried to expose the entire openmrs API as restful resources in order to be dynamic and flexible in terms of front end frameworks.

let me try to disable same libraries that are simultaneously loaded and provided from various sources.

And i think , one of the cause of that , is that different fragments ,bring in their libraries into the same page , which shouldn’t be the case. This brings issues , and sensitive libraries like Angular would have to complain. Ideally all libraries would be provided by the page , and the fragments would just use what the page provides .We could probably make this a convention.

cc @dkayiwa @ssmusoke

@mozzy has your suggestion fixed the problem?

@mozzy, I don’t have much context about this specific issue. Were you able to resolve it?

1 Like

@mddubey , i did not solve this error here ,however much i tried out several options to un load some angular libraries.

However i got another work around and i think it the better way.

  • The first approach i had taken , i had written a separate app_config file , and a separate.fragment for the widget , however that has been causing me problems with loading Angular.
  • I instead decided to use the existing dashboardWidgets_app.json and that means rendering into the existing generic dashboardWidget.gsp Fragment ,then adding new angular component for the Appointments in the Folder here https://github.com/openmrs/openmrs-module-coreapps/tree/master/omod/src/main/web/dashboardwidgets . That solved the problem of angular not loading.