此代码是一个使用angularjs ..的简单表单向导。我的问题是,当我单击(PreviousBtn)时,它清除了先前的数据..因此,我声明了一个变量来保存数据,无论执行什么步骤..但它适用于前一个{$ scope.selectedoutjobForCompanion = vm.postedValues.selectedoutjobForCompanion; },并没有为第二个工作 {$ scope.selectedLeader = vm.postedValues.selectedLeader;}。且没有错误,我使用{console.log($ scope.selectedLeader)}检查了赋值操作,它起作用了,但在html中没有反映;
var vm = this;
vm.step = "one";
vm.stepOne = stepOne;
vm.stepTwo = stepTwo;
vm.stepThree = stepThree;
vm.stepFour = stepFour;
vm.postedValues = {};
function stepOne() {
vm.step = "one";
$scope.selectedoutjobForCompanion = vm.postedValues.selectedoutjobForCompanion;
$scope.selectedLeader = vm.postedValues.selectedLeader; // this is the Problem
console.log($scope.selectedLeader); // this line works, i checked it.
}
function stepTwo() {
vm.step = "two";
}
function stepThree() {
vm.step = "three";
}
function stepFour() {
vm.step = "four";
}
$scope.selectedoutjobChangedForCompanion = function (selectedoutjobForCompanion) {
$scope.postedLeader.Out_Job_ID = selectedoutjobForCompanion.Out_Job_ID;
vm.postedValues.selectedoutjobForCompanion =selectedoutjobForCompanion;
}
$scope.selectedLeaderChanged = function (selectedLeader) {
vm.postedValues.selectedLeader = selectedLeader;
$scope.postedLeader.Emp_ID = selectedLeader.Emp_ID;
$scope.postedLeader.Out_Job_Emp_Type = 2;// 2 = Leader
}
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div class="=jumbotron">
<form ng-controller="outjobsController as vmForm">
<div ng-switch="vmForm.step">
<div class="stepone" ng-switch-when="one">
<h3>Step 1</h3>
<div class="form-group">
<label class="control-label col-md-2 col-sm-3 col-xs-12">
Out Job Name : <span class="required">*</span>
</label>
<div class="col-md-7 col-sm-7 col-xs-12">
<select required class="form-control" ng-options="job as job.Out_Job_Name for job in outJobsTBl"
ng-model="selectedoutjobForCompanion" ng-change="selectedoutjobChangedForCompanion(selectedoutjobForCompanion)">
<option value=''> --Select Out Job-- </option>
</select>
</div>
<div class="col-md-3 col-sm-3 col-xs-12">
<select disabled class="form-control" ng-options="job as job.Out_Job_ID for job in outJobsTBl"
ng-model="selectedoutjobForCompanion">
<option value=''> --Code-- </option>
</select>
</div>
</div>
<div class="form-group">
<label class="control-label col-md-2 col-sm-3 col-xs-12">
Creator of Out Job: <span class="required">*</span>
</label>
<div class="col-md-10 col-sm-5 col-xs-12" ng-controller="empsController">
<div ng-repeat="emp in emps | filter : authentication.userName: emp.Emp_UserName">
<div ng-hide="1">
{{postedCreator.Emp_ID = emp.Emp_ID}} {{postedCreator.Out_Job_Emp_Type = 1}}
</div>
<input type="text" disabled ng-model="emp.Emp_UserName" class="form-control col-md-7 col-xs-12">
</div>
</div>
</div>
<div class="form-group">
<label class="control-label col-md-2 col-sm-5 col-xs-12">
Leader: <span class="required">*</span>
</label>
<div class="col-md-10 col-sm-5 col-xs-12" ng-controller="empsController">
<select required class="form-control" ng-options="emp as emp.Emp_UserName for emp in emps"
ng-model="selectedLeader" ng-change="selectedLeaderChanged(selectedLeader)">
<option value=''> -- Select Leader -- </option>
</select>
</div>
</div>
<br><br><br><br>
<div class="text-left col-md-2 col-sm-1 col-xs-12">
<button type="button" class="btn btn-primary" ng-click="vmForm.stepTwo()">Next</button>
</div>
</div>
<div class="stepTwo" ng-switch-when="two">
<h3>Step 2</h3>
<br><br><br><br>
<div class="text-left col-md-2 col-sm-1 col-xs-12">
<button type="button" class="btn btn-warning" ng-click="vmForm.stepOne()">Previous</button>
</div>
<div class="text-left col-md-2 col-sm-1 col-xs-12">
<button type="button" class="btn btn-primary" ng-click="vmForm.stepThree()">Next</button>
</div>
</div>
<div class="stepThree" ng-switch-when="three">
<h3>Step 3</h3>
</div>
<br><br><br><br>
<div class="text-left col-md-2 col-sm-1 col-xs-12">
<button type="button" class="btn btn-warning" ng-click="vmForm.stepTwo()">Previous</button>
</div>
<div class="text-left col-md-2 col-sm-1 col-xs-12">
<button type="button" class="btn btn-primary" ng-click="vmForm.stepFour()">Next</button>
</div>
</div>
<div class="stepfour" ng-switch-when="four">
<h3>Step 4</h3>
<br><br><br><br>
<div class="text-left col-md-2 col-sm-1 col-xs-12">
<button type="button" class="btn btn-warning" ng-click="vmForm.stepThree()">Previous</button>
</div>
<div class="text-left col-md-2 col-sm-1 col-xs-12">
<button type="button" class="btn btn-success" ng-click="CreatCompanions()">Submit</button>
</div>
</div>
</div>
</form>
</div>