How to concat strings using AngularJS ?
Last Updated :
26 Jul, 2024
Improve
In this article, we will see how to concat strings in AngularJS. There are few ways to concat the strings in AngularJS. In this article, we will see 2 of them.
Example 1: In the first example, we are using the '+' operator to concat the strings
<!DOCTYPE HTML>
<html>
<head>
<script src=
"https://ajax.googleapis.com/ajax/libs/angularjs/1.2.13/angular.min.js">
</script>
<script>
var myApp = angular.module("app", []);
myApp.controller("controller", function($scope) {
$scope.str1 = 'This is ';
$scope.str2 = 'GeeksForGeeks';
$scope.res = '';
$scope.join = function() {
$scope.res = $scope.str1 + $scope.str2;
};
});
</script>
</head>
<body style = "text-align:center;">
<h1 style = "color:green;">
GeeksForGeeks
</h1>
<p>
How to concat strings in AngularJS
</p>
<div ng-app = "app">
<div ng-controller = "controller">
str1 - '{{str1}}'
<br>
str2 - '{{str2}}'
<br>
<br>
<input type = "button"
ng-click = "join()" value = "Click Here">
<br>
<p>Result = '{{res}}'</p>
</div>
</div>
</body>
</html>
<html>
<head>
<script src=
"https://ajax.googleapis.com/ajax/libs/angularjs/1.2.13/angular.min.js">
</script>
<script>
var myApp = angular.module("app", []);
myApp.controller("controller", function($scope) {
$scope.str1 = 'This is ';
$scope.str2 = 'GeeksForGeeks';
$scope.res = '';
$scope.join = function() {
$scope.res = $scope.str1 + $scope.str2;
};
});
</script>
</head>
<body style = "text-align:center;">
<h1 style = "color:green;">
GeeksForGeeks
</h1>
<p>
How to concat strings in AngularJS
</p>
<div ng-app = "app">
<div ng-controller = "controller">
str1 - '{{str1}}'
<br>
str2 - '{{str2}}'
<br>
<br>
<input type = "button"
ng-click = "join()" value = "Click Here">
<br>
<p>Result = '{{res}}'</p>
</div>
</div>
</body>
</html>
Output:
Example 2: In the second example we will use the standard concat() method for concatenation.
<!DOCTYPE HTML>
<html>
<head>
<script src=
"https://ajax.googleapis.com/ajax/libs/angularjs/1.2.13/angular.min.js">
</script>
<script>
var myApp = angular.module("app", []);
myApp.controller("controller", function($scope) {
$scope.str1 = 'This is ';
$scope.str2 = 'GeeksForGeeks';
$scope.res = '';
$scope.join = function() {
$scope.res = $scope.str1.concat($scope.str2);
};
});
</script>
</head>
<body style = "text-align:center;">
<h1 style = "color:green;">
GeeksForGeeks
</h1>
<p>
How to concat strings in AngularJS
</p>
<div ng-app = "app">
<div ng-controller = "controller">
str1 - '{{str1}}'
<br>
str2 - '{{str2}}'
<br>
<br>
<input type = "button"
ng-click = "join()" value = "Click Here">
<br>
<p>Result = '{{res}}'</p>
</div>
</div>
</body>
</html>
<html>
<head>
<script src=
"https://ajax.googleapis.com/ajax/libs/angularjs/1.2.13/angular.min.js">
</script>
<script>
var myApp = angular.module("app", []);
myApp.controller("controller", function($scope) {
$scope.str1 = 'This is ';
$scope.str2 = 'GeeksForGeeks';
$scope.res = '';
$scope.join = function() {
$scope.res = $scope.str1.concat($scope.str2);
};
});
</script>
</head>
<body style = "text-align:center;">
<h1 style = "color:green;">
GeeksForGeeks
</h1>
<p>
How to concat strings in AngularJS
</p>
<div ng-app = "app">
<div ng-controller = "controller">
str1 - '{{str1}}'
<br>
str2 - '{{str2}}'
<br>
<br>
<input type = "button"
ng-click = "join()" value = "Click Here">
<br>
<p>Result = '{{res}}'</p>
</div>
</div>
</body>
</html>
Output: