Question

我正在使用materialize选择列表格式来创建一个从数据库填充数据的列表。这是我的angular / html代码：

        <div class="row">
            <div class="input-field col s12">
                <select ng-model="ctrl.selectedBrand">
                    <option value="" disabled selected>Select the channel</option>
                    <option ng-repeat="brand in ctrl.masterbrands" value="{{brand}}"> {{brand}}
                    </option>
                </select>
                <label>Choose the channel</label>
            </div>
        </div>

    </div>

我知道数据正在被正确提取，因为当我尝试

时

<p ng-repeat="brand in ctrl.masterbrands" value="{{brand}}"> {{brand}} </p>

我的所有数据都出现在我的前端。我在选择列表中使用ng-repeat的方式有什么问题吗？

修改

根据这个answer我在$（'select'）中添加了.special_select（）;在我的ng-repeat之后，这首先工作，然后在我测试我的网站时停止工作！

                <select ng-model="ctrl.selectedBrand">
                    <option value="" disabled selected>Select the channel</option>
                    <option ng-repeat="brand in ctrl.masterbrands" value="{{brand}}"> {{brand}}
                    </option>
                    $('select').material_select();
                </select>

有谁知道为什么会这样？

Answer 1

面对类似的问题。找到工作代码和下面的简要说明。

这是我的工作控制器代码：

angular.module("app")
.controller('demoController', ['$scope','$timeout', function ($scope, $timeout) {
    var self = this;

    function init() {
        self.dialCodes = [
            {   "name": "United States",
                "dial_code": "+1",
                "code": "US"
            }, {
                "name": "India",
                "dial_code": "+91",
                "code": "IN"
            }, {
                "name": "United Kingdom",
                "dial_code": "+44",
                "code": "GB"
           }];

         $timeout(function () {
            $('select').material_select()
         });
    };
    init();
}]);

实现选择列表HTML代码：

<div class="input-field col s12">
    <select>
       <option value="" disabled selected>Choose your option</option>
       <option ng-repeat="code in ctrl.dialCodes" value={{code.dial_code}}">
             {{code.name}}</option>
    </select>
    <label>Materialize Select</label>
</div>

简要说明

看到发生的事情是，在ng-repeat实际上可以完成其动作之前，我们的小实现jQuery代码：

$('select').material_select()

启动并创建选择列表。

但是通过在$ timeout中包装jQuery代码，它会等到下一个摘要周期然后创建选择列表。

这是工作选择列表

Answer 2

使用setTimeout

后，将输入内容置于select中

 setTimeout(function(){
        $('select').material_select();
    },1000);

Answer 3

目前，您可以访问link 1和Link 2获取详细信息中的错误

对此最好的解决方案是使用materialize.css的角度包装器，您可以在Angular Materialize找到它

查看以下代码段

＆＃13;

_tkinter.TclError: wrong # coordinates: expected 0 or 4, got 16

＆＃13;

angular.module('myapp', ['ui.materialize']).controller('testController', ['$scope', function($scope) {
  $scope.brand = {
    value: "LG",
    alltypes: ["LG", "SAMSUNG", "NOKIA", "HTC", "SONY"]
  };
}]);

＆＃13;

ng-repeat在物化中不起作用选择列表

3 个答案:

简要说明