如何将 struts1 与 angularjs 混合使用以自动填充字段
How to mix struts1 with angularjs to auto populate a field
我正在用 struts1 构建一个 jsp 页面(我不能使用 struts2),其中我有一个字段,我会自动填充来自表单的值,但用户可以自由覆盖该文本字段中的任何内容。我还使用 AngularJS 能够在用户键入时提供选项(google-like 搜索),当他们覆盖由 struts.
预填充的值时
我的问题是 struts 中的 html:text 标签无法识别标签 ng-model 和 uib-typeahead。如果我切换到普通的 html 输入标签,那么 angular 功能可以工作,但现在我无法使用 struts.
预填充该字段
script.js:
angular.module('plunker', ['ui.bootstrap','ngAnimate']).controller('TypeaheadCtrl', function($scope, $http) {
$scope.selected = undefined;
// Any function returning a promise object can be used to load values asynchronously
$scope.getLocation = function(val) {
return $http.get('http://maps.googleapis.com/maps/api/geocode/json', {
params: {
address: val,
sensor: false
}
}
).then(function(response){
return response.data.results.map(function(item){
return item.formatted_address;
});
});
};
});
mypage.html
<body ng-controller="TypeaheadCtrl">
<div class='container-fluid typeahead-demo' >
<div class="section">
<!-- OPTION 1: angular works and gives suggestions, but the field doesn't get pre-populated by struts-->
<input type="text" name="city" id="city" class="gui-input" ng-model="asyncSelected" uib-typeahead="address for getLocation($viewValue)" placeholder="Type city name">
<html:hidden property="city"/>
<!-- OPTION 2: auto-populates value but it can't compile with ng-model and typegead tags -->
<html:text property="city" styleClass="gui-input" styleId="cityStyle" />
</div>
</div>
谁能告诉我最好的或合适的方法是什么?我如何混合选项 1 和选项 2 的功能?
提前致谢。
我已经通过在加载时使用 jquery 设置字段的值来解决它,但是如果有人有更好的解决方案或更好的做法,我想知道。
我正在用 struts1 构建一个 jsp 页面(我不能使用 struts2),其中我有一个字段,我会自动填充来自表单的值,但用户可以自由覆盖该文本字段中的任何内容。我还使用 AngularJS 能够在用户键入时提供选项(google-like 搜索),当他们覆盖由 struts.
预填充的值时我的问题是 struts 中的 html:text 标签无法识别标签 ng-model 和 uib-typeahead。如果我切换到普通的 html 输入标签,那么 angular 功能可以工作,但现在我无法使用 struts.
预填充该字段script.js:
angular.module('plunker', ['ui.bootstrap','ngAnimate']).controller('TypeaheadCtrl', function($scope, $http) {
$scope.selected = undefined;
// Any function returning a promise object can be used to load values asynchronously
$scope.getLocation = function(val) {
return $http.get('http://maps.googleapis.com/maps/api/geocode/json', {
params: {
address: val,
sensor: false
}
}
).then(function(response){
return response.data.results.map(function(item){
return item.formatted_address;
});
});
};
});
mypage.html
<body ng-controller="TypeaheadCtrl">
<div class='container-fluid typeahead-demo' >
<div class="section">
<!-- OPTION 1: angular works and gives suggestions, but the field doesn't get pre-populated by struts-->
<input type="text" name="city" id="city" class="gui-input" ng-model="asyncSelected" uib-typeahead="address for getLocation($viewValue)" placeholder="Type city name">
<html:hidden property="city"/>
<!-- OPTION 2: auto-populates value but it can't compile with ng-model and typegead tags -->
<html:text property="city" styleClass="gui-input" styleId="cityStyle" />
</div>
</div>
谁能告诉我最好的或合适的方法是什么?我如何混合选项 1 和选项 2 的功能?
提前致谢。
我已经通过在加载时使用 jquery 设置字段的值来解决它,但是如果有人有更好的解决方案或更好的做法,我想知道。