当添加到Angular 4应用程序时，Kendo UI会创建双输入

Question

我正在使用ASP.NET MVC应用程序。 我最近添加了Angular 4，现在我正在尝试使用一些Kendo UI控件。我已按照https://www.telerik.com/kendo-angular-ui/components/inputs/numerictextbox/

中建议的方式添加了它

然而，我没有单个输入字段like here，而是获得双输入。我检查了源代码，它生成了以下html。 知道为什么它不能正常工作吗？

在我的HTML中我只是说：

<kendo-numerictextbox>
    [value]="value" [min]="0" [max]="100" [autoCorrect]="autoCorrect">
</kendo-numerictextbox>

生成的html：

<kendo-numerictextbox class="ng-tns-c0-0 k-widget k-numerictextbox" ng-reflect-auto-correct="false" ng-reflect-max="100" ng-reflect-min="0" ng-reflect-value="5" dir="ltr">
    <span class="k-widget k-numerictextbox" style="">
        <span class="k-numeric-wrap k-state-default">
            <input type="text" class="k-formatted-value k-input" tabindex="0" title="" aria-disabled="false" aria-readonly="false" style="display: inline-block;">
            <input data-role="numerictextbox" role="spinbutton" class="k-input" type="text" aria-valuenow="" aria-disabled="false" aria-readonly="false" style="display: none;">
                <span class="k-select">
                    <span unselectable="on" class="k-link" style="touch-action: pan-y;">
                        <span unselectable="on" class="k-icon k-i-arrow-n" title="Increase value">Increase value</span>
                    </span>
                    <span unselectable="on" class="k-link" style="touch-action: pan-y;"><span unselectable="on" class="k-icon k-i-arrow-s" title="Decrease value">Decrease value</span>
                </span>
            </span>
        </span>
    </span>
    <!--bindings={
  "ng-reflect-decrement": "Decrease value",
  "ng-reflect-increment": "Increase value"
    }-->
    <span class="k-numeric-wrap">
        <input autocomplete="off" autocorrect="off" class="k-input k-formatted-value" role="spinbutton" ng-reflect-events="[object Object]" id="f663efa5-b8d0-a63d-ffaf-4bd8ca1bbfb9" aria-valuemin="0" aria-valuemax="100" title="" tabindex="0">
        <!--bindings={
"ng-reflect-ng-if": "true"
}--><span class="k-select" ng-reflect-events="[object Object]">
            <span class="k-link k-link-increase" aria-label="Increase value" title="Increase value">
                <span class="k-icon k-i-arrow-n"></span>
            </span>
            <span class="k-link k-link-decrease" aria-label="Decrease value" title="Decrease value">
                <span class="k-icon k-i-arrow-s"></span>
            </span>
        </span>
    </span>
  </kendo-numerictextbox>

Answer 1

我设法通过将我的所有剑道等CDN更新到最新版本来修复它。实际上可能是导致此问题的jQuery。也许它与Angular 4不兼容