编辑 - 许多更改
我的页面加载后,我有一些javascript函数调用返回数据,这些数据将在我的标记中用于填充标记选项。
目前的问题是:当javascript外部(甚至在AngularJS控制器内)更改值时。视图未更新。我已经尝试在$ scope中包装范围分配。$ apply(...)但是这只会导致$ digest()已经在进行中。
AngularJS代码:
app.service('userService', ['$http', function($http) {
var userModel = {
qGroupZero: '',
qGroupOne: '',
qGroupTwo: ''
};
var states = '';
return{
getUserModel: function() {
return userModel;
},
getStates: function() {
return states;
},
loadChallengeQuestions: function() {
var userEnrollmentChallenge = getChallengeQuestions();
console.log('loadChallengeQuestions()');
userModel.qGroupZero = userEnrollmentChallenge.challengeQuestions.questionGroup[0];
userModel.qGroupOne = userEnrollmentChallenge.challengeQuestions.questionGroup[1];
userModel.qGroupTwo = userEnrollmentChallenge.challengeQuestions.questionGroup[2];
},
loadStates: function(callback) {
console.log('loadStates()');
return $http.get('content/states.json').then(function(result) {
states = result.data;
});
}
};
}]);
app.controller('EnrollmentController', ['$scope', 'userService', '$http', function($scope, userService, $http) { //Dependencies and Constructor function.
$scope.userService = userService;
$scope.states = [];
userService.loadChallengeQuestions();
var userModel = userService.getUserModel();
$scope.qGroupZero = userModel.qGroupZero.challengeQuestion; //<-- This assignment is not updated in the view.
userService.loadStates().then(function(result) {
$scope.states = userService.getStates(); //<-- This assignment is not updated in the view.
});
}]);
challengeQuestion的内容是一个包含7个项目的JSON数组。
标记:
<select ng-model="selectionOne"
name="question1"
ng-options="opt as opt.questionText for opt in qGroupZero">
</select>
<select ng-model="state"
name="state"
ng-options="opt as opt.abbreviation for opt in states"
class="required">
</select>
所以在这一点上。我有我所有的资源。我只需要找到一种方法让AngularJS重新评估ng-options值($ scope.value)并重绘内容?我想我说得对......
为什么我觉得这应该很容易?三天后,我在这里:D
感谢阅读和帮助!!!
答案 0 :(得分:0)
如果您使用angular $ http服务和promise对象怎么办?
app.service('userService', ['$http', function($http) {
var userModel: {
qGroupZero: '',
qGroupOne: '',
qGroupTwo: ''
};
var states = '';
return{
getUserModel: function(){
return userModel;
},
getStates: function(){
return states;
},
loadChallengeQuestions: function(userEnrollmentChallenge) {
console.log('loadChallengeQuestions()');
userModel.qGroupZero = userEnrollmentChallenge.challengeQuestions.questionGroup[0];
userModel.qGroupOne = userEnrollmentChallenge.challengeQuestions.questionGroup[1];
userModel.qGroupTwo = userEnrollmentChallenge.challengeQuestions.questionGroup[2];
},
loadStates: function(){
return $http.get('content/states.json').then(function(result){
states = result.data;
});
}
}
});
app.controller('EnrollmentController', ['$scope', 'userService', function($scope, userService) { //Dependencies and Constructor function.
$scope.states = [];
userService.loadStates().then(function(result){
var userModel = userService.getUserModel();
$scope.states = userService.getStates();
$scope.qGroupZero = userModel.qGroupZero.challengeQuestion;
});
}]);