Angular JS in Aras12
How to use Angular JS in Aras 12?
Forum Discussion
5 Replies
Suhas,
That depends strongly on what you want to do with it.
I happened to be working on a section of the UI today, and when I saw your question I decided to try doing a basic binding in the view I was working in. Since I already had a cshtml file open, I put a reference to the angular library in the head
<head>
</head><body><div ng-app=""><p>Name: <input type="text" ng-model="name"></p><p ng-bind="name"></p></div><!-- the rest of my body --></body>
The binding worked, so the short answer is "feed it a reference and write your binding, it'll work." While codetree edits like this aren't recommended as a first approach, this does show there's no conflict to using AngularJS in Aras Innovator. Wherever you happen to be writing javascript code, you're always just a quick source statement away from writing a few lines of AngularJS. That isn't to say that we're getting the full power of AngularJS here, but much of what AngularJS does is already covered by Aras Innovator. For example, most instances where I'd want to set up routing in an Angular app I'd handle with itemtypes and forms in Aras Innovator.
Where I've used AngularJS in the past, it was to build single page applications. AngularJS was at its most useful to me for making smooth and responsive front ends, which makes the question of where you're trying to show this to the user highly relevant. I'd love to hear more about what goal you have in mind- I'm interested in Angular and Aras, and the combination could be amazing if they could take advantage of each other's strengths! In particular if you're trying to use it in a view or form, let me know some details about the configuration and how much logic you need to make happen and I can look into how it would interact with Aras Innovator's Methods.
Skyler Crossman
Thank you for response.
Aras Innovator method is returning SOAP message. And Angular will work with only JSON data.
So again I need do conversion from SOAP to JSON?
Is it possible to bind ng-model for Aras properties which are present on Aras form?
For external html pages or Aras form html properties it's possible, but again for some html page part (some tags or properties) it will work and for remaining properties will not work(inconsistent behavior on same html page ). How to overcome this issue?
Regards,
Suhas
Suhas,
Angular does prefer JSON, it's true. Depending on what you need to display, it may be easier to look for a specific property on the returning SOAP message. Any property which can be found clientside should work with ng-model, though in particular I would keep an eye on when properties become available. In the past, I've had issues where some data was already present and thus worked cleanly with ng-model, while other parts of the same object involved API calls and thus required promises. Aras Innovator communicates with the database for much of the information it displays, and that would explain inconsistent behavior on the same HTML page.
The easiest situation might be one where you make one SOAP call, convert that once to JSON, then bind properties as needed. A more complex situation might be one where, in response to what they see, the user will prompt for different pieces of data. In that case it might make more sense to make a promise per page or per update, then wait for the conversion to finish before resolving the promise.
Of course, that's a guess at the source of the issue, and you may find something different. If some properties do work, then Angular is working within Aras Innovator, and you can focus your efforts on making sure that data is ready when Angular needs it.
Best,
Skyler C.
