奇怪的行为NgOptions

时间:2018-06-18 13:17:41

标签: angularjs internet-explorer model-binding ng-options

使用AngularJS版本v1.2.9 我有两个控制器的页面。一切正常,除了选择使用ng-options,但只在IE中。 Chrome工作正常 无法发布整个代码,因为它是1500loc。

这里是HTML代码段:

<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.executeOrDelayUntilScriptLoaded是异步的。

在Chrome中,它按预期工作 在IE10 / IE11中加载数据,当第一次选择一个选项时,UI显示第一个。再次选择(其他)选项时,UI会显示正确的选项。注意:当我点击“保存”时即使UI显示错误的值,传递的值也总是正确的 这只是一个视觉问题 控制台中没有错误。
另一个注意事项:使用ng-include加载HTML片段。我也尝试使用ng-include将html代码插入到页面中,IE上的问题仍然存在。

任何提示?

0 个答案:

没有答案