feat(tagsInput): Add newTagText option

Add an option for binding to the text of the inner input element.
This feature is important because it allows developers to know when
the input has changed as well the state of the input at the time of
the change. An example use case is doing custom validations that
regular expressions couldn't satisfy.

Closes #197

src/tags-input.js

@@ -10,6 +10,8 @@
  *
  * @param {string} ngModel Assignable angular expression to data-bind to.
  * @param {string=} [template=NA] URL or id of a custom template for rendering each tag.
+ * @param {string} newTagText Assignable angular expression for data-binding to the underlying input for a new tag.
+ * @param {string=} [displayProperty=text] Property to be rendered as the tag label.
  * @param {string=} [keyProperty=text] Property to be used as a unique identifier for the tag.
  * @param {string=} [displayProperty=text] Property to be rendered as the tag label.
  * @param {string=} [type=text] Type of the input element. Only 'text', 'email' and 'url' are supported values.
@@ -151,6 +153,7 @@ tagsInput.directive('tagsInput', function($timeout, $document, $window, tagsInpu
         require: 'ngModel',
         scope: {
             tags: '=ngModel',
+            newTagText: '=?',
             onTagAdding: '&',
             onTagAdded: '&',
             onInvalidTag: '&',
@@ -262,6 +265,18 @@ tagsInput.directive('tagsInput', function($timeout, $document, $window, tagsInpu
                 }
             };
 
+            scope.$watch('newTag.text', function(value) {
+                if(scope.newTag.text !== scope.newTagText) {
+                    scope.newTagText = value;
+                }
+            });
+
+            scope.$watch('newTagText', function(value) {
+                if(scope.newTag.text !== scope.newTagText) {
+                    scope.newTag.setText(value);
+                }
+            });
+
             scope.track = function(tag) {
                 return tag[options.keyProperty || options.displayProperty];
             };

test/tags-input.spec.js

@@ -440,6 +440,33 @@ describe('tags-input directive', function() {
         });
     });
 
+    describe('new-tag-text option', function() {
+        it('updates as text is typed into the input field', function() {
+            // Arrange
+            compile('new-tag-text="innerModel"');
+
+            // Act
+            sendKeyPress('f'.charCodeAt(0));
+            sendKeyPress('o'.charCodeAt(0));
+            sendKeyPress('o'.charCodeAt(0));
+
+            // Assert
+            expect($scope.innerModel).toEqual('foo');
+        });
+
+        it('updates the input field as the scope\'s model changes', function() {
+            // Arrange
+            compile('new-tag-text="innerModel"');
+
+            // Act
+            $scope.innerModel = 'foo';
+            $scope.$digest();
+
+            // Assert
+            expect(getInput().val()).toEqual('foo');
+        });
+    });
+
     describe('tabindex option', function() {
         it('sets the input field tab index', function() {
             // Arrange/Act