diff --git a/src/components/toast/toast.js b/src/components/toast/toast.js
index bedc742722e..84301f868c1 100644
--- a/src/components/toast/toast.js
+++ b/src/components/toast/toast.js
@@ -338,10 +338,16 @@ function MdToastProvider($$interimElementProvider) {
var templateRoot = document.createElement('md-template');
templateRoot.innerHTML = template;
+ // Iterate through all root children, to detect possible md-toast directives.
for (var i = 0; i < templateRoot.children.length; i++) {
if (templateRoot.children[i].nodeName === 'MD-TOAST') {
var wrapper = angular.element('
');
- wrapper.append(templateRoot.children[i].children);
+
+ // Wrap the children of the `md-toast` directive in jqLite, to be able to append multiple
+ // nodes with the same execution.
+ wrapper.append(angular.element(templateRoot.children[i].childNodes));
+
+ // Append the new wrapped element to the `md-toast` directive.
templateRoot.children[i].appendChild(wrapper[0]);
}
}
diff --git a/src/components/toast/toast.spec.js b/src/components/toast/toast.spec.js
index 6aa2f0ad71e..1bc87c63d95 100644
--- a/src/components/toast/toast.spec.js
+++ b/src/components/toast/toast.spec.js
@@ -209,6 +209,20 @@ describe('$mdToast service', function() {
expect(toast.length).not.toBe(0);
}));
+ it('should correctly wrap the custom template', inject(function($timeout, $rootScope, $rootElement) {
+ var parent = angular.element('
');
+
+ setup({
+ template: 'Message',
+ appendTo: parent
+ });
+
+ var toast = $rootElement.find('md-toast');
+ $timeout.flush();
+
+ expect(toast[0].querySelector('.md-toast-content').textContent).toBe('Message');
+ }));
+
it('should add position class to toast', inject(function($rootElement, $timeout) {
setup({
template: '',