Question

我目前正在使用Ionic创建应用。我需要两个复选框来查看它们是否被选中，以便我可以决定稍后推送信息的位置。

所以我在文档中读到复选框架有一个'checked'属性，它返回一个布尔值。我第一次尝试它时，代码看起来像这样：

cc.html

<ion-item>
  <ion-label>Course Start Date</ion-label>
  <ion-checkbox [(ngModel)]="csd"></ion-checkbox>
</ion-item>

<ion-item>
  <ion-label>Course End Date</ion-label>
  <ion-checkbox [(ngModel)]="ced"></ion-checkbox>
</ion-item>
<button ion-button full (click)="AddNewCourse()">
    Add
</button>

cc.ts

csd:any;
ced:any;

AddNewCourse(){
 if(this.csd.checked && this.ced.checked){
    console.log('pushed here');
 }else if(!this.csd.checked && this.ced.checked){
   console.log('push there');
 }
}

但我最终得到错误无法读取未定义的属性'已检查'。所以我想如果我初始化可行的值，那么在构造函数中：

this.csd = false;
this.ced = false;

仍然给了我同样的错误。所以在搜索了一下之后我发现可能我应该使用[checked]。但事实证明[(ngModel)]和[checked]不能一起工作，这导致我回归零。

最后我想也许ngOnInit()可以做到这一点。但不幸的是，同样的问题仍然存在。

我不确定此刻我做错了什么，我的眼睛变得模糊，所以我确定我做了一些愚蠢的事情，让事情变得如此复杂。任何帮助将不胜感激，谢谢。

Answer 1

csd和ced仅被声明但从未初始化。如果您想在csd和ced变量中包含已检查的属性，请同时声明并初始化该属性。

csd: any = {checked: false}
ced: any = {checked: false}

Answer 2

<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
<body>

<div ng-app="myApp" ng-controller="myCtrl">
Name: <input ng-model="name">
{{checkFn()}}
<input type="checkbox" ng-model="value" ng-checked="checkFn()">
</div>


<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
    $scope.name = "John Doe";
    $scope.value =true;
    $scope.checkFn= function(){
    return $scope.value ? $scope.value :false;
}
});

</script>

</body>
</html>

无法读取未定义的角度离子的“已检查”属性

2 个答案: