0

Hi I am bit new to angular, I have used a code in my view which references a clockpicker bootstrap plugin to pick the time.

         <div class="row" ng-repeat="ScheduleData in viewScheduleData.schedule">
            <div class="col-md-3">{{ScheduleData.day}}</div>
              <div class="col-md-3">
                  <div class="input-group clockpicker">
                    <input type="text" class="form-control" value="{{ScheduleData.time_start}}">
                      <span class="input-group-addon"><span class="glyphicon glyphicon-time"></span>
                      </span>
                  </div>
              </div>

but its not working when the components are loaded, but the clockpicker works fine individually

Vr1010101
  • 49
  • 10
  • can you put some "functional" example? like in Jsfiddle or plunkr.. – Javierif Oct 26 '16 at 11:47
  • https://weareoutman.github.io/clockpicker/ this is the one that i tried – Vr1010101 Oct 26 '16 at 12:16
  • When components are loaded... which components? u check console log? some error? u cant reproduce error in jsfiddle? or post complete code to try reproduce ur error... – Javierif Oct 26 '16 at 12:26

1 Answers1

0

you need to use angular version of plugin, which creates directive to use at runtime, when your components or any element with that directive loads, you can no t use simple $(document).ready() in angular

here is the angular version of same plugin https://github.com/linagora/angular-clockpicker

just add data-lng-clockpicker in your input as attribute(directive)

Sagar Rabadiya
  • 4,126
  • 1
  • 21
  • 27