首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >使用AngularJS填充用于选择选项的扫描器源数组

使用AngularJS填充用于选择选项的扫描器源数组
EN

Stack Overflow用户
提问于 2016-12-19 11:03:00
回答 1查看 673关注 0票数 0

我正在开发一个web界面,用于扫描和上传使用AngularJS客户端的文档,以及Dynamsoft的Dynamic与扫描仪的接口。

我试图用从Dynamsoft的<select>检索到的可用源数组填充一个DWObject,但是选项没有被填充。我认为问题可能是在页面加载后初始化了DWObject,但我可能错了。(我是AngularJS新手)。

这是我的代码: HTML

代码语言:javascript
复制
<select ng-options="item.label for item in asyncSources track by item.value" ng-model="source">
    <option value="">Select Option</option>
</select>

JavaScript

代码语言:javascript
复制
function scannerController($scope) {

    // Register OnWebTwainReady event. This event fires as soon as Dynamic Web TWAIN is initialized and ready to be used
    Dynamsoft.WebTwainEnv.RegisterEvent('OnWebTwainReady', $scope.Dynamsoft_OnReady);

    // The DWObject is the object that interfaces with all scanner devices
    var DWObject;
    $scope.source = {
        name: '',
        value: 0
    };
    $scope.asyncSources = [];

    // Load the scanner sources
    $scope.loadSources = function () {
        if (DWObject) {
            var count = DWObject.SourceCount; // Populate how many sources are installed in the system

            for (var i = 0; i < count; i++) {
                arr.push({ label: DWObject.GetSourceNameItems(i), value: i })
            }
            $scope.asyncSources = angular.copy(arr);
        }
    }

// Initialise the Dynamsoft Scanner interface
    $scope.Dynamsoft_OnReady = function () {
        Dynamsoft.WebTwainEnv.Unload();
        Dynamsoft.WebTwainEnv.Load();// load all the resources of Dynamic Web TWAIN

        // Delay the retrieval of the Dynamic Web TWAIN Object until AngularJS had fully loaded the page template.
        setTimeout(function () {
            DWObject = Dynamsoft.WebTwainEnv.GetWebTwain('dwtcontrolContainer');// Get the Dynamic Web TWAIN object that is embeded in the div with id 'dwtcontrolContainer'
            if (DWObject) {
                // Allow users to scan more than 2
                DWObject.IfAllowLocalCache = true;
                DWObject.SelectionImageBorderColor = 0xff0000;
                $scope.loadSources();
                // Try load settings from cookies first
                getSourceFromCookie();
                if ($scope.initialSettingsLoad) $scope.initializeSettings();
            }
        }, 2000);
    }

asyncSources使用选项填充,但select选项没有更新。

代码语言:javascript
复制
$scope.asyncSources
[[object Object],[object Object]]
[prototype]: []
length: 2
[0]: {...}
[1]: {...}

JSON.stringify($scope.asyncSources)
"[{\"label\":\"PaperStream IP fi-7160 #2\",\"value\":0},{\"label\":\"HP HD Webcam [Fixed]\",\"value\":1}]"

更新:添加所需信息

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2016-12-19 12:45:36

当第三方代码更新范围数据时,您需要触发角摘要周期以使更改生效,因为角不知道已经发生了更改。

调用$digest或$apply会告诉角更新并触发任何手表。

代码语言:javascript
复制
$scope.asyncSources = angular.copy(arr);
$scope.$apply();

您还可以在角$timeout函数中包装您的更改,以防止"Error:$digest已经在进行“,如果您试图并行地执行它。

代码语言:javascript
复制
$timeout(function(){
  $scope.asyncSources = angular.copy(arr);
});
票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/41221182

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档