AngularJS 选择的组合框不加载 $http.get 变量

Posted 2023-05-09

【中文标题】AngularJS 选择的组合框不加载 $http.get 变量

【英文标题】：AngularJS chosen combo box does not load $http.get variables

【发布时间】：2016-05-05 06:28:50

【问题描述】：

所以这与我之前的问题有关：

Dynamically add options to a Angular chosen combo box

基本上是这样的：

 <select  ui-jq="chosen" ng-model='program_list'  class="form-control">
    <option value=""></option>
    <option ng-repeat="program in programs"> program.title </option>
</select>

虽然我尝试了 ng-repeat 和 ng-options，但它不起作用。如果它是静态数据，它可以工作，但从 $http.get 获取的数据不会作为选项推送。

然而，我后来发现：（其中 a 是 $scope）

a.programs=["id":"1","title":"This is a sample","id":"2","title":"Sample Title"];

在我的控制器中推送到组合框，所以最后我意识到问题出在这里：（其中 b 是 $http）

 b.get('http://localhost/training_system/retrieve_train.php?program=Y')
.then(function (result) 
    //a.programs=result.data;
    var prog=[];
    for(var key in result.data)
        prog.push(result.data[key]);

    
    a.programs=prog;    

    );

我几乎解决了它，但我无法让它工作。如果我提醒（a.programs），这会留下一个空白通知。最后怎么解决？

（顺便说一句，如果我将变量写在组合框之外，例如：）

<label class="form-label" for="field-1">Select Training Program <span ng-repeat='program in programs'>program.title</span></label>

它出现了。只是不在组合框内。

---这可能会与我之前的问题合并，我只需要找到它的解决方案。

【问题讨论】：

你能检查一下选择元素，看看有没有选项吗？

没有选项。它主要是选择组合框结构

【参考方案1】：

它可以是您正在使用的 jquery 插件，也可以是您的 rest 端点。尝试从这个端点获取http，看看它是否更快..https://httpbin.org/get?item1=Option1&item2=Option2。您需要稍微更改一下您的控制器代码，因为它会以不同的数据结构进行响应。这应该有效：

$http.get('https://httpbin.org/get?item1=Option1&item2=Option2')
.then(function (result) 
    var prog=[];
    for(var key in result.data.args)
        prog.push(result.data.args[key]);

    
    $scope.programs = prog;    

);

然后在 html 中：

<h1>Selected item: program_list</h1>
<select ng-model='program_list'  class="form-control">
    <option value="">Select one</option>
    <option ng-repeat="program in programs"> program </option>
</select>

Here 是一个可以摆弄的笨蛋。请注意，这不使用 jquery 插件，因此如果它添加了额外的功能，我的示例可能不适用。

【讨论】：

我试过了，它可以工作......除了它没有 ui-jq 线。当我添加它时，选项不再出现。所以它必须是 jquery 插件......它不适用于 http.get 但适用于静态数据

我确实需要选择的插件，因为非多重下拉菜单是可搜索的，而且我有大量数据。并且选择中的多个下拉列表允许多个选择

也许你应该使用像this这样的纯角度多重下拉库。

【参考方案2】：

我通过以下方式解决了这个问题：

window.setInterval(function() 
$('.chosen').trigger('chosen:updated');
, 1000);