Angularjs 奇怪的行为和选择
使用AngularJS v1.2.9版。 我有两个控制器的页面。除了使用ng选项选择外,所有都可以正常工作,但仅在IE中。Chrome可以正常工作。 无法发布整个代码,因为它是1500loc 下面是HTML代码片段:Angularjs 奇怪的行为和选择,angularjs,internet-explorer,model-binding,ng-options,Angularjs,Internet Explorer,Model Binding,Ng Options,使用AngularJS v1.2.9版。 我有两个控制器的页面。除了使用ng选项选择外,所有都可以正常工作,但仅在IE中。Chrome可以正常工作。 无法发布整个代码,因为它是1500loc 下面是HTML代码片段: <div class="auswahlDialog ms-dlgContent"> <div class="ms-dlgBorder"> <div class="ms-dlgTitle"> <
<div class="auswahlDialog ms-dlgContent">
<div class="ms-dlgBorder">
<div class="ms-dlgTitle">
<span class="ms-dlgTitleBtns" ng-click="closeUploadDocumentDialog()">
<span style="padding: 8px; height: 16px; width: 16px; display: inline-block;">
<span class="s4-clust">
<img src="/_layouts/15/images/fgimg.png?rev=23" alt="Dialogfeld schließen" class="ms-dlgCloseBtnImg" />
</span>
</span>
</span>
<h2 class="ms-webpart-titleText">Kunde auswählen</h2>
</div>
<div class="ms-dlgFrameContainer" style="overflow: hidden;">
<div class="neueAkte">
<table cellpadding="0" cellspacing="0" border="0">
<tbody>
<tr>
<td valign="middle">Dokumentart:</td>
<td>
<select ng-model="betriebsaktart" ng-options="b.id as b.title for b in betriebsaktarten" style="background-color: #fff;"/>
</td>
</tr>
<tr>
<td colspan="2" align="right">
<div style="padding-top: 10px;">
<input type="button" value="Save" onclick="return false;" ng-click="saveItem(betriebsaktart)" class="ms-ButtonHeightWidth">
<input type="button" value="Cancel" ng-click="closeDialog()" />
</div>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
数据来自SharePoint,但它是一组非常简单的对象:
SP.SOD.executeOrDelayUntilScriptLoaded(function(){
var ctx = SP.ClientContext.get_current();
var web = ctx.get_web();
var list = web.get_lists().getById("14995573-DAA6-4334-AE6B-D79CB98EC92C"); //Betriebsaktarten
var query = new SP.CamlQuery();
query.set_viewXml('<View><Query><OrderBy><FieldRef Name="Title"/></OrderBy></Query></View>');
var items = list.getItems(query);
ctx.load(items);
ctx.executeQueryAsync(function() {
$scope.betriebsaktarten = items.get_data().map(function(item){
return {
id: item.get_id(),
title: item.get_item('Title'),
}
});
$scope.$digest();
}, function(request, error) {
$scope.$digest();
showError(error);
})
}, 'SP.js')
对于非SharePoint开发人员:$scope.$digest;必须调用,因为SP.SOD.executeOrderLayUntilScriptLoaded是异步的
在Chrome中,它按预期工作。
在IE10/IE11中,当第一次选择某个选项时,用户界面会显示第一个选项。再次选择另一个选项时,UI将显示正确的选项。注意:当我单击“保存”时,传递的值总是正确的,即使UI显示的是错误的值。
这只是一个视觉问题。
控制台中没有错误。
另一个注意事项:HTML代码段是使用ng include加载的。我还尝试使用ng include将html代码插入到页面中,但IE上的问题仍然存在
有什么提示吗?您试过使用吗?如果我没记错的话,ng选项带来了很多痛苦,可以通过简单的ng重复来避免……当我开始使用angularJS时,我读到,由于绑定,应该避免在选项上使用ng重复。要解决这些问题,您首先需要隔离它-使用一个select和$timeout创建简单的plunk,而不是$http调用?