1

I have an AngularJS app and use the ui-router for routing. One of my pages has two similar sections with the same template and logic (so I hope they can use the same controller). The only difference between them is for example type property. Here is simplified fiddle of the page: http://jsfiddle.net/e_gluhotorenko/XeX59/7/.

So Is it possible to provide custom different data to the views's scopes ? Something like custom data in states but for views:

views: {
    'section1' : {
        templateUrl: 'section.html',
        controller : 'ctrl',
        data : { type: 'type1'}
    },
    'section2' : {
        templateUrl: 'section.html',
        controller : 'ctrl',
        data : { type: 'type2'}
    }
}

Or with ui-view directive like in ng-inclide's onload:

<div ui-view="section1" onload="type = 'type1'"></div>
<div ui-view="section2" onload="type = 'type2'"></div>
Eugene Gluhotorenko
  • 3,094
  • 2
  • 33
  • 52

2 Answers2

2

Just found out that ui-view actually has onload attribute, it is absent in documentation but is in API ref. So my example from the question works! fiddle

Eugene Gluhotorenko
  • 3,094
  • 2
  • 33
  • 52
1

Did you try ng-init as in <div ui-view="section1" ng-init="type = 'type1'"></div>? That should work, I would link the angular docs for ng-init, but the site seems to be down right now

BramSlob
  • 11
  • 1
  • I think `ng-init` should be called in the parent scope, so we just initialize `type` from parent scope twice. Check this http://jsfiddle.net/GXLZm/1/ – Eugene Gluhotorenko Feb 20 '14 at 17:23
  • @e.gluhotorenko your jsfiddle seems to do what i suggested, to call `ng-init` on those 2 divs. I merely wrote just one of the two divs. A jsfiddle is always better though, nice! – BramSlob Feb 21 '14 at 07:48
  • If the latest jsfiddle does not do what I/you would expect, than I think I don't understand the question. What are you trying to accomplish, if the behavior above is not as expected? – BramSlob Feb 21 '14 at 09:28
  • Look, I need to pass different values to `tepmplate1`'s and `tepmplate2`'s scopes. Both these scopes are inherited from `main`scope so that they have access to the `type` property that was initialized in the main scope so that the tepmplate1`'s and the `tepmplate2`'s scopes do not have their own `type`. Is it clearer now ? :) – Eugene Gluhotorenko Feb 21 '14 at 09:51
  • I like the ng-init alternative. In the provided fiddle, if you try to do `$scope.someValue = $scope.type;` you will find that `$scope.type` is undefined when you enter the controller. Using `ng-init` you will see the expected output `section type1. Type : type1 section type2. Type : type2` – Ena Dec 06 '17 at 10:13