mirror of
https://github.com/Hopiu/angular.js.git
synced 2026-03-16 23:30:23 +00:00
fix(re-bootstrap): Throw an error when bootstrapping a bootstrapped element.
Nothing would prevent a user from accidentally calling angular.bootstrap on an element that had already been bootstrapped. If this was done, odd behavior could manifest in an application, causing different scopes to update the same DOM, and causing debugger confusion. This fix adds a check inside of angular.bootstrap to check if the passed-in element already has an injector, and if so, will throw an error.
This commit is contained in:
parent
94ec84e7b9
commit
3ee744cc63
3 changed files with 61 additions and 0 deletions
29
docs/content/error/ng/btstrpd.ngdoc
Normal file
29
docs/content/error/ng/btstrpd.ngdoc
Normal file
|
|
@ -0,0 +1,29 @@
|
|||
@ngdoc error
|
||||
@name ng:btstrpd
|
||||
@fullName App Already Bootstrapped with this Element
|
||||
@description
|
||||
|
||||
Occurs when calling angular.bootstrap on an element that has already been bootstrapped.
|
||||
|
||||
This usually happens when you accidentally use both `ng-app` and `angular.bootstrap` to bootstrap an application.
|
||||
|
||||
```
|
||||
<html>
|
||||
...
|
||||
<body ng-app="myApp">
|
||||
<script>
|
||||
angular.bootstrap(document.body, ['myApp']);
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
```
|
||||
|
||||
Note that for bootrapping purposes, the `<html>` element is the same as `document`, so the following will also throw an error.
|
||||
```
|
||||
<html>
|
||||
...
|
||||
<script>
|
||||
angular.bootstrap(document, ['myApp']);
|
||||
</script>
|
||||
</html>
|
||||
```
|
||||
|
|
@ -1049,6 +1049,12 @@ function angularInit(element, bootstrap) {
|
|||
function bootstrap(element, modules) {
|
||||
var doBootstrap = function() {
|
||||
element = jqLite(element);
|
||||
|
||||
if (element.injector()) {
|
||||
var tag = (element[0] === document) ? 'document' : startingTag(element);
|
||||
throw ngMinErr('btstrpd', "App Already Bootstrapped with this Element '{0}'", tag);
|
||||
}
|
||||
|
||||
modules = modules || [];
|
||||
modules.unshift(['$provide', function($provide) {
|
||||
$provide.value('$rootElement', element);
|
||||
|
|
|
|||
|
|
@ -656,6 +656,32 @@ describe('angular', function() {
|
|||
/\[\$injector:modulerr] Failed to instantiate module doesntexist due to:\n.*\[\$injector:nomod] Module 'doesntexist' is not available! You either misspelled the module name or forgot to load it\./
|
||||
);
|
||||
});
|
||||
|
||||
|
||||
it('should complain if an element has already been bootstrapped', function () {
|
||||
var element = jqLite('<div>bootstrap me!</div>');
|
||||
angular.bootstrap(element);
|
||||
|
||||
expect(function () {
|
||||
angular.bootstrap(element);
|
||||
}).toThrowMatching(
|
||||
/\[ng:btstrpd\] App Already Bootstrapped with this Element '<div class="?ng\-scope"?( ng\-[0-9]+="?[0-9]+"?)?>'/i
|
||||
);
|
||||
|
||||
dealoc(element);
|
||||
});
|
||||
|
||||
|
||||
it('should complain if manually bootstrapping a document whose <html> element has already been bootstrapped', function () {
|
||||
angular.bootstrap(document.getElementsByTagName('html')[0]);
|
||||
expect(function () {
|
||||
angular.bootstrap(document);
|
||||
}).toThrowMatching(
|
||||
/\[ng:btstrpd\] App Already Bootstrapped with this Element 'document'/i
|
||||
);
|
||||
|
||||
dealoc(document);
|
||||
})
|
||||
});
|
||||
|
||||
|
||||
|
|
|
|||
Loading…
Reference in a new issue