Angularjs 角度表上次添加的行未加载引导日历

Angularjs 角度表上次添加的行未加载引导日历,angularjs,datepicker,Angularjs,Datepicker,我正在使用angular将会议信息加载到表中。当我尝试向表中添加新行时,添加的行不会加载上一个引导日历,因为当我调用函数动态加载日期选择器时,angular尚未完成加载该行。在Angular完成加载新行后,如何调用load datepicker 这是我的密码: <div ng-controller="virtualmeetingdetails" id="virtualmeetingdetails"> <div class=

我正在使用angular将会议信息加载到表中。当我尝试向表中添加新行时,添加的行不会加载上一个引导日历,因为当我调用函数动态加载日期选择器时,angular尚未完成加载该行。在Angular完成加载新行后,如何调用load datepicker

这是我的密码:

            <div ng-controller="virtualmeetingdetails" id="virtualmeetingdetails">
                <div class="row" id="proposedaddboards">
                    <div class="form-group required">
                        <label id="adboardnumber" class="control-label col-sm-4" for="spinner1">Proposed Number of Advisory Boards</label>
                        <div class="col-sm-4">
                            <div id="spinnerDiv1" class="input-group spinner">
                                <asp:TextBox id="spinner1" cssclass="form-control" value="0" runat="server" />
                                <div class="input-group-btn-vertical">
                                    <button class="btn btn-default" type="button" ng-click="addUser()"><i class="fa fa-caret-up"></i></button>
                                    <button class="btn btn-default" type="button"><i class="fa fa-caret-down"></i></button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="row" id="tblVirtualMeeting">
                    <div class="form-group required">
                        <div class="col-sm-12" >
                            <table class="table table-bordered table-striped" jq-table>
                                <thead style="background-color:#cad4d9">
                                    <tr>
                                        <th>Proposed Date</th>
                                        <th>Virtual Meeting</th>
                                        <th>Location City</th>
                                        <th>State</th>
                                        <th>Country</th>
                                        <th></th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <tr ng-repeat="meeting in meetings">
                                        <td>
                                            <div class="input-group input-append date" id="dtpicker{{$index}}" data-date-format="mm/dd/yyyy" style="width:150px;">
                                                <span class="text-center" ng-show="editMode">{{meeting.proposedbegindate}}</span>
                                                <input type="text" class="form-control col-sm-3" runat="server" ng-hide="editMode" ng-model="meeting.proposedbegindate" />
                                                <span class="input-group-addon add-on" ng-hide="editMode">
                                                    <span class="glyphicon glyphicon-calendar"></span>
                                                </span>
                                            </div>                                                
                                        </td>
                                        <td>
                                            <select ng-model="meeting.isvirtualmeeting" ng-hide="editMode"
                                                    ng-options="option.text for option in virtualmeetingoptions track by option.value" class="form-control">                
                                            </select>
                                            <span class="text-center" ng-show="editMode">{{meeting.isvirtualmeeting.text}}</span>
                                        </td>
                                        <td>

                                        <span class="text-center" ng-show="editMode">{{meeting.venuecity}}</span>
                                        <input type="text" class="form-control" ng-hide="editMode" ng-model="meeting.venuecity" />                                                
                                            </td>
                                        <td>
                                            <select ng-model="meeting.venuestateID" ng-hide="editMode" ng-options="state.StateConst for state in statesList track by state.StateID" class="form-control"></select>
                                            <span class="text-center" ng-show="editMode">{{meeting.venuestateID.StateConst}}</span>  
                                        </td>
                                        <td>

                                            <select ng-model="meeting.venuecountryid" ng-hide="editMode" ng-options="country.CountryName for country in countriesList track by country.CountryID" class="form-control"></select>
                                            <span class="text-center" ng-show="editMode">{{meeting.venuecountryid.CountryConst}}</span>
                                        </td>
                                        <td style="width:170px">
                                            <span class="glyphicon glyphicon-pencil" style="color: green; font-size: medium; cursor: pointer" ng-show="editMode" ng-click="editMode = false; editUser(participant)"></span>&nbsp;
                                            <span class="glyphicon glyphicon-floppy-save" style="color: #337ab7; font-size: medium; cursor: pointer" ng-hide="editMode" ng-click="editMode = true;saveField(meeting, <%=_CurrentUserID %>);"></span>&nbsp;
                                            <span class="glyphicon glyphicon-remove-circle" style="color: red;font-size:medium;cursor:pointer" ng-click="removeItem($index)"></span>
                                        </td>
                                    </tr>

                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>

咨询委员会的拟议数目
拟议日期
虚拟会议
位置城市
陈述
国家
{{会议.提议开始日期}
{{meeting.isvirtualmeeting.text}
{{会议.维努埃西蒂}
{{meeting.venuestateID.StateConst}
{{meeting.venuecountryid.CountryConst}
控制器:

app.controller("virtualmeetingdetails", function ($scope, $http) {
    $http.get("../Services/EngagementDataService.asmx/GetVirtualMeetings", { params: { 'mid': getParameterByName('mid')} })
    .success(function (response) {
        var j = response.length;
        var i = 0;

        if (response.length > 0) {
           while (i < j) {
                response[i].proposedbegindate = moment(response[i].proposedbegindate).format("MM/DD/YYYY");
                i++
            }
        }



    ....more code goes here (removed)



    $scope.addUser = function () {
        $scope.editing = true;
        var meetingcount;
        if (typeof $scope.meetings === "undefined")
            meetingcount = 0
        else meetingcount = $scope.meetings.length;

        $scope.inserted = {
            engagementproposedinfoid: 0,
            id: meetingcount + 1,
            venuecity: '',
            proposedbegindate: '',
            venuestateid: 0,
            venuecountryid: 1,
            isvirtualmeeting: 0
        };

        $scope.meetings.push($scope.inserted);

        rendercalendars(meetingcount);

    };

});
app.controller(“virtualmeetingdetails”),函数($scope,$http){
$http.get(“../Services/EngagementDataService.asmx/getvirtualmetings”,{params:{'mid':getParameterByName('mid')})
.成功(功能(响应){
var j=响应长度;
var i=0;
如果(response.length>0){
而(i
用于呈现日期选择器的函数:

function rendercalendars(rows) {
    var nowDate = new Date();
    var today = new Date(nowDate.getFullYear(), nowDate.getMonth(), nowDate.getDate(), 0, 0, 0, 0);

    var j = rows;
    var i = 0;

    while (i < j) {
        $('#dtpicker' + i).datepicker({ autoclose: true, startDate: today });
        i++
    }
}
函数rendercalendars(行){
var nowDate=新日期();
var today=新日期(nowDate.getFullYear(),nowDate.getMonth(),nowDate.getDate(),0,0,0);
var j=行;
var i=0;
而(i
调用$scope.addUser时会发生此问题……它会在调用rendercalendars函数之前加载表行,因此不会加载日期选择器


任何帮助都将不胜感激。

我猜是这样的:

在这一行中,你改变了你的范围,在下一个摘要周期中,你的重复将是“重做”。因此你的html将得到调整

$scope.meetings.push($scope.inserted);
然后调用渲染函数,如果之前遇到了摘要,那么它就会变得一团糟

rendercalendars(meetingcount);
但那只是我的猜测

顺便说一句,有一个引导组件的角度实现(ui引导),这样您就不必做jQuery的事情了


Home这是一种帮助。

除了使用ui引导实现此功能之外,您还有什么其他建议吗?我对Angular非常陌生。我不确定Angular元素完全加载后是否会调用某个事件。有人知道我将如何解决此问题吗?请提前感谢。