Angularjs 角度表上次添加的行未加载引导日历
我正在使用angular将会议信息加载到表中。当我尝试向表中添加新行时,添加的行不会加载上一个引导日历,因为当我调用函数动态加载日期选择器时,angular尚未完成加载该行。在Angular完成加载新行后,如何调用load datepicker 这是我的密码:Angularjs 角度表上次添加的行未加载引导日历,angularjs,datepicker,Angularjs,Datepicker,我正在使用angular将会议信息加载到表中。当我尝试向表中添加新行时,添加的行不会加载上一个引导日历,因为当我调用函数动态加载日期选择器时,angular尚未完成加载该行。在Angular完成加载新行后,如何调用load datepicker 这是我的密码: <div ng-controller="virtualmeetingdetails" id="virtualmeetingdetails"> <div class=
<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>
<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>
<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元素完全加载后是否会调用某个事件。有人知道我将如何解决此问题吗?请提前感谢。