Material: Compiling material directives on the fly: md-input-has-value attribute not set

Created on 28 May 2015  路  4Comments  路  Source: angular/material

I'm trying to dynamically compile material directives. It works, but for some reason, doesn't get the md-input-has-value attribute set, even though my inputs have a value set.

Maybe I'm doing something wrong ?

Here is an example:

$('<div id="foo"><md-input-container><label for="myInput">Plop</label><input id="myInput" name="myInput" value="48" type="text"/></md-input-container></div>').appendTo('body');

scope = $rootScope.$new();
$compile($('#foo').contents())(scope);

My input correctly gets the material styles, but since the md-input-has-value attribute isn't set, the value isn't displayed unless the input gets the focus.

Maybe I am missing something ?

bug

Most helpful comment

@ThomasBurleson this is more than a low priority to my project, I'm adding an md-input-container with an input inside to a dynamically generated form and while the data then works I've had to add the following to get it to detect the init state:

ng-class="{'md-input-has-value': model.value}"

I'd prefer a solution more long term prior to releasing the Material version of the form generator I'm working on to end users.

All 4 comments

I'll answer to my own question: it seems it will only work if the input is binded to some variable (ie: input has ng-model set). Is it intended ?

I think this is a bug. :+1:

@warpdesign This looks very similar to #2162 which effects both IE and Firefox. Which browser were you seeing this problem in? Does #3582 fix it for you?

@ThomasBurleson this is more than a low priority to my project, I'm adding an md-input-container with an input inside to a dynamically generated form and while the data then works I've had to add the following to get it to detect the init state:

ng-class="{'md-input-has-value': model.value}"

I'd prefer a solution more long term prior to releasing the Material version of the form generator I'm working on to end users.

Was this page helpful?
0 / 5 - 0 ratings