Javascript 嵌套数据列表'；选项'；在'；分区'；“显示”；元素'；选项'；不能嵌套在元素'；分区'&引用；

代码运行良好，但我希望更好的方法不会抛出任何警告或错误，以使代码看起来更干净。 除了将

选项

放在

div

内，还有其他方法吗

我可以通过使用

datalist

的

id

来实现这一点。 但是，对于国家、城市、地区等有很多

datalist

，最好使用每个

datalist

的

id

将数据绑定到datalist

<input id="input-id" list="datalist-id" type="text" placeholder="Select Cluster Group" autocomplete="off" />
<datalist id="datalist-id">
    <div ng-repeat="country in Countries">
        <option> {{country.name}} </option>
    </div>
</datalist>

除了使用

datalist

的

id

之外，还有什么有效的方法吗？因此，我可以为每个数据列表重用相同的代码

<input id="input-id" list="datalist-id" type="text" placeholder="Select Cluster Group" autocomplete="off" />
<datalist id="datalist-id">
    <div ng-repeat="country in Countries">
        <option> {{country.name}} </option>
    </div>
</datalist>

{{country.name}

您需要删除

div

并将

ng repeat

代码放在

选项中。
请参阅修改后的代码，如下所示：

<input id="input-id" list="datalist-id" type="text" placeholder="Select Cluster Group" autocomplete="off" />
<datalist id="datalist-id">
    <option ng-repeat="country in Countries" value="{{country.name}}" /> 
</datalist>