Angular Can'；t绑定到'；xxx和x27；因为它不是'；t'的已知属性；标记yyy'；剑道角度下拉列表

我正在用剑道UI开发angular 8应用程序

因此，我有一个自定义模板下拉列表：

<kendo-dropdownlist name="theme"
                    [data]="themeItems"
                    [textField]="'text'"
                    [valueField]="'id'"
                    [(ngModel)]="theme"
                    (valueChange)="onChangeTheme($event)"
                    style="width: 100%">
    <ng-template kendoDropDownListValueTemplate let-dataItem>
        <span *ngIf="dataItem != null">
            <i class="fa fa-circle text-{{dataItem?.id}} pr-1"></i>{{ dataItem?.text }}
        </span>
    </ng-template>
    <ng-template kendoDropDownListItemTemplate let-dataItem>
        <span data-toggle="theme" [data-theme]="dataItem.url">
            <i class="fa fa-circle text-{{dataItem.id}} pr-1"></i>{{ dataItem.text }}
        </span>
    </ng-template>
</kendo-dropdownlist>

我看到错误

无法绑定到“数据主题”，因为它不是“span”的已知属性

我该怎么解决呢？
我想应该是这样的
data-theme=“{{dataItem.url}}”

在左边没有
[]
，但在
=
的右边应该是
{{}
data-theme=“{{dataItem.url}}”

左边没有
[]
，右边的
{{}
代码应该是：
[attr.data theme]=“dataItem.url”
代码应该是：
[attr.data theme]=“dataItem.url”
不幸的是，它没有帮助我
无法绑定到'theme'，因为它不是'span'的已知属性。
不幸的是，它没有帮助我
无法绑定到'theme'，因为它不是'span'的已知属性。
。
themeItems = [
        {
            id: 'default',
            text: 'Default',
            url: 'default'
        }, {
            id: 'amethyst',
            text: 'Amethyst',
            url: 'assets/css/themes/amethyst.min.css'
        }, {
            id: 'city',
            text: 'City',
            url: 'assets/css/themes/city.min.css'
        }
];