答案 0 :(得分:0)
您可以使用ng-model和ng-bind。 以角度4 - https://coursetro.com/posts/code/58/Angular-4-Property-Binding-Tutorial
检查在Angular 1中 - https://docs.angularjs.org/api/ng/directive/ngBind
答案 1 :(得分:0)
HTML:
<textarea rows="4">{{user.content}}</textarea>
JS:
var app = angular.module('myApp', []);
app.controller('userCtrl', function($scope) {
$scope.user = {
'content': 'Theming support in an application can be pretty useful.'
};
});
答案 2 :(得分:0)
我让你简单的plnkr例子 它将显示预填充数据和textarea的更改,它将显示警报
要理解的主要内容是ng-model,它使用ng-model="textArea"
将输入类型=“textarea”与变量textArea绑定在一起
答案 3 :(得分:0)
angular.module("gMap", [])
.service("gMap", function($q) {
var directionsService = new google.maps.DirectionsService();
var map;
var origin = null;
var destination = null;
var waypoints = [];
var markers = [];
this.initialize = initialize;
this.calcRoute = calcRoute;
this.reset = reset;
//functions here
});
calcRoute
函数以返回承诺:function calcRoute() {
var mode = google.maps.DirectionsTravelMode.DRIVING;
var request = {
origin: origin,
destination: destination,
waypoints: waypoints,
travelMode: mode,
optimizeWaypoints: true,
avoidHighways: false
};
var pointsDefer = $q.defer();
directionsService.route(request, function(response, status) {
if (status == google.maps.DirectionsStatus.OK) {
//Code snipped
̶v̶a̶r̶ ̶p̶o̶i̶n̶t̶s̶_̶t̶e̶x̶t̶a̶r̶e̶a̶=̶d̶o̶c̶u̶m̶e̶n̶t̶.̶g̶e̶t̶E̶l̶e̶m̶e̶n̶t̶B̶y̶I̶d̶(̶"̶p̶o̶i̶n̶t̶s̶_̶t̶e̶x̶t̶a̶r̶e̶a̶"̶)̶;̶
̶p̶o̶i̶n̶t̶s̶_̶t̶e̶x̶t̶a̶r̶e̶a̶.̶v̶a̶l̶u̶e̶ ̶=̶ ̶p̶o̶i̶n̶t̶s̶_̶t̶e̶x̶t̶;̶
var pointsObj = {};
pointsObj.routeCenter = response.routes[0].bounds.getCenter();
pointsObj.routeSpan = response.routes[0].bounds.toSpan();
pointsObj.routePoints =
response.routes[0].overview_path
.map( _ => ({
lat: _.lat(),
lng: _.lng()
}));
pointsDefer.resolve(pointsObj);
clearMarkers();
directionsDisplay.setDirections(response);
} else { pointsDefer.reject(status); };
});
return pointsDefer.promise;
}
请注意,上述函数会删除用<textarea>
填充数据的代码。相反,代码返回一个AngularJS承诺,该承诺随数据解析。
<textarea>
<body ng-app="app" ng-controller="ctrl as vm">
<h2>Google Map route point generator</h2>
Click on the map to select the route points (up to 8).
<br/><br/>
<input type="button" value="Get Points" ng-click="vm.calcRoute()" />
<input type="button" value="Reset" ng-click="vm.reset()" />
<br/><br/>
<div id="map_canvas"></div>
<br/>
̶<̶t̶e̶x̶t̶a̶r̶e̶a̶ ̶r̶e̶a̶d̶o̶n̶l̶y̶ ̶i̶d̶=̶"̶p̶o̶i̶n̶t̶s̶_̶t̶e̶x̶t̶a̶r̶e̶a̶"̶ ̶o̶n̶C̶l̶i̶c̶k̶=̶"̶s̶e̶l̶e̶c̶t̶_̶a̶l̶l̶(̶)̶;̶"̶>̶
̶<̶/̶t̶e̶x̶t̶a̶r̶e̶a̶>̶
<br/>
{{vm.points | json}}
</body>
angular.module("app",['gMap'])
.run(function(gMap){
gMap.initialize();
})
.controller("ctrl", function(gMap) {
this.calcRoute = function() {
var promise = gMap.calcRoute();
promise.then( data => {
this.points = data;
})
};
this.reset = function() {
gMap.reset();
this.points = {};
};
})
答案 4 :(得分:0)
您可以像这样定义您的Textarea:
<textarea ng-model='test_textarea'></textarea>
然后你应该像这样在控制器中初始化你的textarea:
$scope.test_textarea = "content";
当文档DOM准备就绪时,您的角度应用程序会初始化 - 因此,使用$ scope.test_textarea值覆盖该值。