The expression passed to onload
evaluates every time a new partial is loaded. In this case you are changing the values of var
twice so by the time both partials are loaded the current value will be B
You want to pass different data to each partial/template (with the underlying html file being the same). To achieve this, as Tiago mentions, you could do it with different controllers. For example, consider the following
<body ng-controller='MainCtrl'>
<div ng-include src='"toBeIncluded.html"' ng-controller='ctrlA' onload="hi()"></div>
<div ng-include src='"toBeIncluded.html"' ng-controller='ctrlB' onload="hi()"></div>
</body>
Here, we have two partials, each with its own scope managed from their own controller (ctrlA
and ctrlB
), both children scopes of MainCtrl
. The function hi()
belongs to the scope of MainCtrl
and will be run twice.
If we have the following controllers
app.controller('MainCtrl', function($scope) {
$scope.msg = "Hello from main controller";
$scope.hi= function(){console.log('hi');};
});
app.controller('ctrlA', function($scope) {
$scope.v = "Hello from controller A";
});
app.controller('ctrlB', function($scope) {
$scope.v = "Hello from controller B";
});
And the contents of toBeIncluded.html
are
<p>value of msg = {{msg}}</p>
<p>value of v = {{v}} </p>
The resulting html would be something along the following lines
<p>value of msg = Hello from main controller</p>
<p>value of v = Hello from main controller A </p>
and
<p>value of msg = Hello from main controller</p>
<p>value of v = Hello from controller B </p>
Example here: http://plnkr.co/edit/xeloFM?p=preview
与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…