javascript - Material Angular 虚拟重复不在下拉列表中显示值

标签 javascript angularjs angular-material

我正在尝试在用户不断滚动时为下拉选择设置无限重复。

使用 $http 尝试了一些类似的方法。但似乎无法让它发挥作用。

   $scope.infiniteItems = {
           numLoaded_: 0,
           toLoad_: 0,
           items: [],

           // Required.
           getItemAtIndex: function (index) {
               if (index > this.numLoaded_) {
                   this.fetchMoreItems_(index);
                   return null;
               }
               return this.items[index];
           },

           // Required.
           getLength: function () {
               return this.numLoaded_ + 25;
           },

           fetchMoreItems_: function (index) {
               if (this.toLoad_ < index) {
                   this.toLoad_ += 10;
                   AssemblyJigsFactory.getData().then(angular.bind(this, function (obj) {
                       this.items = this.items.concat(obj.data.success.data);
                       this.numLoaded_ = this.toLoad_;
                   }));
               }
           }
       };

如果我 console.log( $scope.infiniteItems); 结果是空的,

Object {numLoaded_: 0, toLoad_: 0, items: Array[0]}

我的 HTML 是一个带有此标记的简单对话框弹出

 <md-input-container class="md-block" flex-gt-sm>
                                    <label>Storage Location</label>
                                    <md-select  ng-model="newJig.storagelocation" placeholder="Storage Location"  ng-cloak>
                                        <md-option>
                                          <md-virtual-repeat-container id="vertical-container">
                                            <div md-virtual-repeat="item in infiniteItems"  md-on-demand class="repeated-item" flex>
                                              {{item.name}}
                                            </div>
                                          </md-virtual-repeat-container>
                                          </md-option>
                                        <div ng-hide="allItems.length">No items found</div>
                                    </md-select>
                                </md-input-container>

但是 存储位置 只是没有显示任何值。我也不确定 html 设置是否正确。

我测试过

 AssemblyJigsFactory.getData().then(function(res){

console.log( res.data.success);
});

靠自己,数据源源不断。

Object {total: 50, per_page: 25, current_page: 1, ...

有什么想法吗?

最佳答案

我有同样的问题,如下更改您的 md-input-container

<md-input-container class="md-block" flex-gt-sm>
     <label>Storage Location</label>
     <md-select  ng-model="newJig.storagelocation" placeholder="Storage Location"  ng-cloak>
         <md-virtual-repeat-container id="vertical-container">
             <div md-virtual-repeat="item in infiniteItems"  md-on-demand class="repeated-item" flex>
                 <md-option ng-value='item.value'>{{item.name}}
                 </md-option>
            </div>
         </md-virtual-repeat-container>                                                         
     <div ng-hide="allItems.length">No items found</div>
    </md-select>
</md-input-container>

希望对您有所帮助。

关于javascript - Material Angular 虚拟重复不在下拉列表中显示值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41360897/

相关文章:

javascript - 如何使用文本框值过滤多项选择中的值

javascript - Sproutcore 自定义 CSS

javascript - 与lovefield连接 promise 的异常(exception)情况

angular - 对 Angular Material 表进行排序时,您可以在不修改数据的情况下查看数据吗?

css - 如何将焦点轮廓添加到 Material 按钮

javascript - Laravel 在向服务器发送 JSON 格式的 ISO 格式日期时提示 'trailing data'?

javascript - 如何从另一个矩形中驱逐一个矩形 - Javascript

angularjs - 使用相同的 nginx 配置为 Django 和 Angular 提供服务

javascript - 如何从 Angular js中的服务返回值?

angularjs - 如何在 typescript 中使用 angularjs app.service 和 $q