ng-template 无法读取复选框上未定义的属性 'selected'

Question

在我的代码中我遇到了问题。

我的 HTML 片段是：

<form [formGroup]="personalForm">
   <div style="background-color: gainsboro">
      <div formArrayName="other"
         *ngFor="let other of personalForm.get('other').controls; let i = index"
         class="form-group">
         <div [formGroup]="other">
            <span for="filterName">{{other.controls.filterName.value}}</span>
            <ng-select #ngSelect
            formControlName="searchCreteria"
            [items]="other.value.data"
            [multiple]="true"
            [virtualScroll]="true"
            bindLabel="name"
            [closeOnSelect]="false"
            [clearSearchOnAdd]="true"
            bindValue="name"
            (paste)="onPaste($event,other,i)"
            (clear)="removeCompletePanel(i)"
            [selectOnTab]="true"
            [(ngModel)]="selectedSearchCreteria[i]">
            <ng-template ng-option-tmp let-item="item" let-item$="item$" let-index="index">
               <input [ngModelOptions]="{standalone: true}" [ngModel]="item$.selected" id="item-{{index}}" type="checkbox" /> {{item.name | uppercase}}
            </ng-template>
            <!--<ng-template ng-option-tmp let-item="item" let-index="index">
               <input style="visibility:visible;" [ngModelOptions]="{standalone: true}"  (ngModelChange)=onChange() [(ngModel)]="item.selected" id="item-{{index}}" type="checkbox" /> {{item.name | uppercase}}
               </ng-template>-->
            </ng-select>
         </div>
      </div>
   </div>
   </div>
</form>

在 ng-template 上我收到以下错误，我无法 select 使用单击复选框标签的项目：

Cannot read property 'selected' of undefined

请建议我如何处理这个错误。

更新：

在得到@Poul 的建议后，我成功升级了 angular 和 ng-select。现在我没有收到错误消息，但当我单击复选框标签时，复选框仍未 selected。

但是标签创建成功:

Package.json:

"dependencies": {
    "@angular/common": "~7.1.0",
    "@angular/compiler": "~7.1.0",
    "@angular/core": "~7.1.0",
    "@angular/forms": "~7.1.0",
    "@angular/http": "~7.1.0",
    "@angular/platform-browser": "~7.1.0",
    "@angular/platform-browser-dynamic": "~7.1.0",
    "@angular/router": "~7.1.0",
    "@angular/upgrade": "~7.1.0",
    "angular-in-memory-web-api": "^0.7.0",
    "bootstrap": "3.3.7",
    "core-js": "^2.5.4",
    "reflect-metadata": "0.1.10",
    "es6-shim": "^0.35.1",
    "fancybox": "3.0.0",
    "jquery": "3.1.1",
    "jquery-validation": "1.15.1",
    "jquery-validation-unobtrusive": "3.2.6",
    "natives": "^1.1.4",
    "rxjs": "^6.6.0",
    "rxjs-tslint": "0.1.5",
    "rxjs-compat": "^6.6.0",
    "systemjs": "0.19.40",
    "zone.js": "~0.8.26",
    "jszip": "^3.2.1",
    "typings": "^1.3.2",
    "wijmo": "5.20191.605",
    "@ng-select/ng-select": "2.4.0",
    "@ng-select/ng-option-highlight": "0.0.5"
  },

Answer 1

问题似乎来自那一行： <input [ngModelOptions]="{standalone: true}" [ngModel]="item$.selected" id="item-{{index}}" type="checkbox" /> {{item.name | uppercase}} 这意味着您的 $item 未定义。检查您的变量是否使用正确的名称声明，并且您了解如何使用 let-item

Answer 2

您使用的是（非常）旧版本的 ng-select 和 angular。要解决您遇到的问题，您必须升级到更新的版本。至少angular6才能解决，因为item$模板变量是在ng-select的v2.3.0释放的。

但是，如果您想要最新的 bug/security 修复和功能，最好升级到最新版本。

ng-template 无法读取复选框上未定义的属性 'selected'

ng-template Cannot read property 'selected' of undefined on checkbox

angular

angular-ngselect

ng-template

ng-template 无法读取复选框上未定义的 属性 'selected'

ng-template Cannot read property 'selected' of undefined on checkbox

angular

angular-ngselect

ng-template

ng-template 无法读取复选框上未定义的属性 'selected'