0

I wish to set a relationship between two objects within the same array, for the purpose of noting that one task must be completed before the other can start. I tried using AngularJS's ng-options directive, setting the child object as a property of the parent object using ng-model. This successfully set the property as a reference to the child object (as in, editing the child object would make the changes appear within the parent object, rather than just duplicating it).

Now I face two problems:

  • Recreating the array between sessions- I'm going to be storing the data in a database and/or localstorage. I probably need to store a unique ID for each object and lookup and set that as the property during the load sequence. Is that the best way? Would Angular's private $$hashkey property be appropriate for that or should I make my own "primary keys" for these objects? (I'll have to do that eventually anyway)
  • Setting the child object as a property of the parent object is all well and good, but what if I'm on the child and want to look up the parent? Would this just be a question of looping through everything in the array and finding the ID that matches?

Thank you

Jess
  • 345
  • 1
  • 3
  • 17
  • 1
    do not use angular internal keys, use your own. Question is too broad as there are numerous different potential ways to set all this up and some might depend on use case – charlietfl Feb 15 '16 at 02:39
  • Thank you for that advice anyway @charlietfl – Jess Feb 15 '16 at 19:20

1 Answers1

1

The best way to do this is by using the Angular framework handle the relationships in the bindings - to create a recursive template in the view and also a model in javascript/typescript that the view is bound to.

This is done through using the ng-template directive as a script within the parent html view.

You may have to customize it a bit by setting properties in your controller and binding them to a model. An example of showing/not showing certain controls would be by using the ng-if directive based on the parent model value.

An example of the html required would be:

<script type="text/ng-template" id="recursiveTemplate">
   <ul>
      <li ng-repeat="field in record.fields" ng-include="'recursiveTemplate'">
      </li>
   </ul>
</script>

<ul ng-controller="childCtrl">
   <li ng-repeat="field in records" data-ng-include="'recursiveTemplate'">
   </li>
</ul>

You can find out more information on Stack Overflow by searching for previous responses about recursive templates.

For example: Stack overflow previous answer about recursive templates

Community
  • 1
  • 1
Robert Anderson
  • 1,246
  • 8
  • 11
  • Thank you, the recursive templates look useful for other jobs I have later on. Right now I'm not working on a recursive layout though, I'm just thinking of the data model, and don't intend to display them recursively. – Jess Feb 15 '16 at 21:13