当我在HTML中绑定项目时，我失去了可拖动的功能

Question

我有这样的fullCalendar：

当我改变选择时，我想加载商店（DALIA GLAMOUR; DALIA 15 ......）。但是，如果我用HTML写这样的商店：

<div id='row'>
                    <div id='external-events'>
                        <div id='external-events-listing'>
                            <div class="form-group col-sm-2 fc-event" style="background-color:#1abc9c;">
                                PTO. CARMEN
                            </div>
                            <div class="form-group col-sm-2 fc-event" style="background-color:#d35400;">
                                DALIA GLAMOUR
                            </div>
                            <div class="form-group col-sm-2 fc-event" style="background-color:#9b59b6;">
                                DALIA 15
                            </div>
                            <div class="form-group col-sm-2 fc-event" style="background-color:#34495e;">
                                DALIA 5
                            </div>
                            <div class="form-group col-sm-2 fc-event" style="background-color:#3498db;">
                                SABINA CASINO
                            </div>
                            <div class="form-group col-sm-2 fc-event" style="background-color:#95a5a6;">
                                SASHA LIMONES
                            </div>
                            <div class="form-group col-sm-2 fc-event" style="background-color:#f39c12;">
                                SAM P.BLANCA
                            </div>
                            <div class="form-group col-sm-2 fc-event" style="background-color:#f1c40f;">
                                SAM DEILAND
                            </div>
                            <div class="form-group col-sm-2 fc-event" style="background-color:#e74c3c;">
                                BAJA
                            </div>
                            <div class="form-group col-sm-2 fc-event" style="background-color:#27ae60;">
                                VACACIONES
                            </div>
                        </div>
                      <p>
                        <input type='checkbox' id='drop-remove' checked='checked' />
                        <label for='drop-remove'>remove after drop</label>
                      </p>
                    </div>
                    <div id='calendar'></div>
                    <div style='clear:both'></div>
                </div>

有效。但现在，我有一个像这样的ajax y加载存储：

<div id='row'>
                    <div id='external-events'>

                        <div id='external-events-listing' >
                            <div class="form-group col-sm-2 fc-event" ng-repeat="store in vm.stores | orderBy:'store.id' " id="{{store.id}}" style="background-color:{{store.color}}; text-transform: uppercase;">
                                {{store.name}}
                            </div>
                        </div>
                      <p>
                        <input type='checkbox' id='drop-remove' checked='checked' />
                        <label for='drop-remove'>remove after drop</label>
                      </p>
                    </div>
                    <div id='calendar'></div>
                    <div style='clear:both'></div>
                </div>

我的javascript中有这个ajax：

  ajax.sendApiRequest({zone: vm.store.touristArea}, "GET", "store").then(
        function(response) {
          vm.stores = response.data.concat(constants.STORE_EVENTS);
          console.log("vm.stores", vm.stores)
        },
        (function(error) {

        })
    );

但它不起作用。我在检查员看到，在第一种情况下（没有ajax），div与fc-event类，有＆＃34; ui-draggable ui-draggable-handle＆＃34;上课，但在第二种情况下，不是。有什么想法吗？