不建议污染$rootScope
像这样,您可以在控制器之间共享公共服务数据,也可以简单地为所有选项卡使用一个控制器,如下所示:
[1] 在您的控制器之间共享公共服务数据:
DEMO http://plnkr.co/edit/nxk4IFOWzvaYSLn5jugz?p=preview
脚本语言
angular.module('plunker', ['ui.bootstrap'])
.service('Common', function() {
this.tabData = {};
})
.controller('SampleController', function($scope, Common) {
$scope.tabData = Common.tabData;
})
.controller("SampleTab2Controller", function($scope, Common) {
$scope.tabData = Common.tabData;
});
HTML
<tabset ng-init="steps={step1:true, step2:false}">
<tab heading="Step 1" active="steps.step1">
<div data-ng-controller="SampleController">
<form data-ng-submit="submitTab1()">
<label>Input Text</label>
<input type="text" ng-model="tabData.text" required >
<button type="submit">Next</button>
</form>
</div>
</tab>
<tab heading="Step 2" active="steps.step2">
<div data-ng-controller="SampleTab2Controller">
<form name="step2">
<p>Text from Tab1</p>
<input type="text" ng-model="tabData.text" >
</form>
</div>
</tab>
</tabset>
[2] 对所有选项卡使用一个控制器
DEMO http://plnkr.co/edit/r47n7ZVIlMVaSQ0208gB?p=preview
脚本语言
angular.module('plunker', ['ui.bootstrap'])
.controller('TabController', function($scope) {
});
HTML
<tabset ng-init="steps={step1:true, step2:false}"
ng-controller="TabController">
<tab heading="Step 1" active="steps.step1">
<div>
<form data-ng-submit="submitTab1()">
<label>Input Text</label>
<input type="text" ng-model="tabText" required >
<button type="submit">Next</button>
</form>
</div>
</tab>
<tab heading="Step 2" active="steps.step2">
<div>
<form name="step2">
<p>Text from Tab1</p>
<input type="text" ng-model="tabText" >
</form>
</div>
</tab>
</tabset>