Material Design Lite Checkbox not reflective once

Question

I am using Material Design lite 1.0.4 and Angular.js 1.1.3. I created an incomplete file that contains checkboxes and includes this partial file using:

<div data-ng-include data-src="'views/partials/filter.html'"></div>

Now the problem is that when I refresh the page, it displays old flags once and once tangible. The behavior is unpredictable. Sometimes it works smoothly when updating.

This is one of the checkbox codes:

<label class="mdl-checkbox mdl-js-checkbox mdl-js-ripple-effect">
    <input type="checkbox" class="mdl-checkbox__input" checked />
    <span class="mdl-checkbox__label"> less than 4000</span>
</label>

The code works fine when I do not use ng-include and write the code directly to the html file. But I have to use ng-include, because the partial will be included on several pages, and this also depends on a certain condition (no need to load a template if not needed).

Answer 1

, ajax. :

$rootScope.$on('$viewContentLoaded', function() {
    $timeout(function() {
        componentHandler.upgradeAllRegistered();
    },0);
});

Material Design Lite , MDL, . , DOM, , upgradeElement.

http://www.getmdl.io/started/index.html#dynamic