I am trying to use AngularJS to replace specific text with defined text. Here is my HTML:
<!DOCTYPE html>
<html>
<head>
<title>Directive</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.16/angular.js"></script>
<script type="text/javascript" src="script.js"></script>
</head>
<body ng-app="myApp">
<div hello-world>sometext</div>
</body>
</html>
And here is the corresponding JavaScript code:
var app = angular.module('myApp', []);
app.directive('helloWorld', function() {
return {
restrict: 'AE',
replace: 'true',
template: '<input type="text" ng-model="headline"/><br/>{{headline}}'
};
});
However, when I test this in my browser, I receive the following error message:
Error: [$compile:tplrt] Template for directive 'helloWorld' must have exactly one root element....
Can anyone advise on how to resolve this issue? Thank you.