From 4971ef12d4c2c268cb8d26f90385dc96eba19db8 Mon Sep 17 00:00:00 2001
From: Martin Staffa <mjstaffa@googlemail.com>
Date: Fri, 9 Oct 2015 12:59:01 +0200
Subject: [PATCH] fix(ngMessage): make ngMessage compatible with ngBind

Fixes #8089
Closes #13074

BREAKING CHANGE:

ngMessage is now compiled with a priority of 1, which means directives
on the same element as ngMessage with a priority lower than 1 will
be applied when ngMessage calls the $transclude function.
Previously, they were applied during the initial compile phase and were
passed the comment element created by the transclusion of ngMessage.
To restore this behavior, custom directives need to have
their priority increased to at least "1".
---
 src/ngMessages/messages.js      |  2 ++
 test/ngMessages/messagesSpec.js | 40 +++++++++++++++++++++++++++++++++
 2 files changed, 42 insertions(+)

diff --git a/src/ngMessages/messages.js b/src/ngMessages/messages.js
index 9a5020fe8397..52d1699d3b55 100644
--- a/src/ngMessages/messages.js
+++ b/src/ngMessages/messages.js
@@ -572,6 +572,7 @@ angular.module('ngMessages', [])
     * @ngdoc directive
     * @name ngMessageExp
     * @restrict AE
+    * @priority 1
     * @scope
     *
     * @description
@@ -604,6 +605,7 @@ function ngMessageDirectiveFactory() {
     return {
       restrict: 'AE',
       transclude: 'element',
+      priority: 1, // must run before ngBind, otherwise the text is set on the comment
       terminal: true,
       require: '^^ngMessages',
       link: function(scope, element, attrs, ngMessagesCtrl, $transclude) {
diff --git a/test/ngMessages/messagesSpec.js b/test/ngMessages/messagesSpec.js
index 3d4f1100f06c..d30b3a328a34 100644
--- a/test/ngMessages/messagesSpec.js
+++ b/test/ngMessages/messagesSpec.js
@@ -372,6 +372,46 @@ describe('ngMessages', function() {
     expect(trim(element.text())).toEqual("Enter something");
   }));
 
+
+  it('should be compatible with ngBind',
+    inject(function($rootScope, $compile) {
+
+    element = $compile('<div ng-messages="col">' +
+                       '        <div ng-message="required" ng-bind="errorMessages.required"></div>' +
+                       '        <div ng-message="extra" ng-bind="errorMessages.extra"></div>' +
+                       '</div>')($rootScope);
+
+    $rootScope.$apply(function() {
+      $rootScope.col = {
+        required: true,
+        extra: true
+      };
+      $rootScope.errorMessages = {
+        required: 'Fill in the text field.',
+        extra: 'Extra error message.'
+      };
+    });
+
+    expect(messageChildren(element).length).toBe(1);
+    expect(trim(element.text())).toEqual('Fill in the text field.');
+
+    $rootScope.$apply(function() {
+      $rootScope.col.required = false;
+      $rootScope.col.extra = true;
+    });
+
+    expect(messageChildren(element).length).toBe(1);
+    expect(trim(element.text())).toEqual('Extra error message.');
+
+    $rootScope.$apply(function() {
+      $rootScope.errorMessages.extra = 'New error message.';
+    });
+
+    expect(messageChildren(element).length).toBe(1);
+    expect(trim(element.text())).toEqual('New error message.');
+  }));
+
+
   // issue #12856
   it('should only detach the message object that is associated with the message node being removed',
     inject(function($rootScope, $compile, $animate) {