Menu
In my AngularJS application, I have an issue with string replace in HTML.
Expectation:
Using the same variable as section title and partial of button's label.
Submitted Forms (Form (13G), Form (12C) and etc.,) Attach Submitted Forms Planned Plans (Plan (13G), Plan (12C) and etc.,) Attach Planned Plans Defined Schemes (Scheme (13G), Scheme (12C) and etc.,) Attach Defined Schemes Paid Insurances (Insurance (13G), Insurance (12C) and etc.,) Attach Paid Insurances
Scenario:
I have headerText $scope variable. It contains the LabelNames of each section:
$scope.headerText = [{
LabelName: 'Submitted Forms (Form (13G), Form (12C) and etc.,)'
}, {
LabelName: 'Planned Plans (Plan (16K), Plan (12C) and etc.,)'
}, {
LabelName: 'Defined Schemes (Scheme (11H), Scheme (12C) and etc.,)'
}, {
LabelName: 'Paid Insurances (Insurance (10G), Insurance (12C) and etc.,)'
}];
This LabelName should be the title for each section and the same LabelName need to be used for the button's label text along with the text Attach and also need to remove the text in between the brackets.
So in the HTML file, I tried the below code to achieve the result:
<div ng-repeat="header in headerText">
<span ng-bind="header.LabelName"></span>
<br />
<button>{{addText.replace("{0}", header.LabelName).replace(/(\(.*\))/g, '')}}</button>
<hr />
</div>
Mean, I want to replace the content with brackets along with empty space
(Form (13G), Form (12C) and etc.,)
from
Submitted Forms (Form (13G), Form (12C) and etc.,)
and to use that in the button's label text.
I tried the regexp .replace(/(\(.*\))/g, ''), but it is not supporting.
Is there any way to achieve this in HTML itself.
Sample Plunker
640
You can create variable in component for regex.
myReg = /'/g;
and reference the variable in replace method as below
<span>{{element.configMetadata.replace(myReg , "\"")}}</span>
Move the javascript to script.js and return the value
angular.module('app', []);
function StringCtrl($scope) {
$scope.headerText = [{
LabelName: 'Submitted Forms (Form (13G), Form (12C) and etc.,)'
}, {
LabelName: 'Planned Plans (Plan (13G), Plan (12C) and etc.,)'
}, {
LabelName: 'Defined Schemes (Scheme (13G), Scheme (12C) and etc.,)'
}, {
LabelName: 'Paid Insurances (Insurance (13G), Insurance (12C) and etc.,)'
}];
$scope.addText = 'Attach {0}';
$scope.getText = function(obj){
return $scope.addText.replace("{0}", obj).replace(/(\(.*\))/g, '')
};
}<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<body ng-app="app" ng-controller="StringCtrl">
<div ng-repeat="header in headerText">
<span ng-bind="header.LabelName"></span>
<br />
<button ng-bind="getText(header.LabelName)"></button>
<hr />
</div>
</body>If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
