Chris
Chris

Reputation: 27394

ng-include with ng-init oddity

I created an inline template like so

<script type="text/ng-template" id="/deviceResultsContainer.html">
    {{resultListTitle}}
</script>

If I use it like so

<div ng-include="'/deviceResultsContainer.html'" ng-init="resultListTitle = 'Errors'"></div>
<div ng-include="'/deviceResultsContainer.html'" ng-init="resultListTitle = 'Warnings'"></div>

My output is

Warnings

Warnings

Why would it be listed like this, as opposed to what I'd expect:

Errors

Warnings

Upvotes: 1

Views: 2847

Answers (2)

Kerry Johnson
Kerry Johnson

Reputation: 1033

It seems if you add ng-if="true" or some variation of a truthy statement it will change the order of evaluation to where ng-init gets re-evaluated before ng-include. It's a hack for sure, so use at your own risk.

Upvotes: 0

Malkus
Malkus

Reputation: 3726

Because the $scope value resultListTitle is being set to 'Warnings' last. They are technically both looking at the same value.

I think what you are looking for you probably want to have a directive with isolated $scope.

If you would do the following:

<div ng-include="'/deviceResultsContainer.html'" ng-init="resultListTitle = 'Errors'"></div>
<div ng-include="'/deviceResultsContainer.html'"></div>

You would see this:

Errors

Errors

Upvotes: 2

Related Questions