小编Maa*_*ten的帖子

使用Angular启用/禁用按钮

我正在制作一个角度为4的网络应用程序,我想出了一个问题.它是以下内容:

我使用了一个名为currentLesson的属性.这个属性有一个从1到6的可变数字.在我的组件中,我有一个6课程的列表,每个课程都有自己的按钮来开始本课程.

在此列表中,只有当currentLesson具有课程编号的值时才能单击该按钮:

在以下情况下,第1课的按钮处于活动状态:currentLesson = 1

第2课的按钮在以下情况下处于活动状态:currentLesson = 2

等等

因此,如果currentLesson = 2,则应禁用第1,3,4,5和6课的按钮.

我有以下设置,但它似乎不起作用.在我的组件中我有:

export class ClassComponent implements OnInit {
  classes = [
{
  name: 'string',
  level: 'string',
  code: 'number',
  currentLesson: '1'
}]



checkCurrentLesson1 = function(classes) {
if (classes.currentLesson = 1) { 
 return true;
}
else {
 return false;
}
};

checkCurrentLesson2 = function(classes) {
if (classes.currentLesson = 2) {
 return true;
}
else {
 return false;
}
};
Run Code Online (Sandbox Code Playgroud)

我的html文件是这样的:

 <ul class="table lessonOverview">
    <li>
      <p>Lesson 1</p>
      <button [routerLink]="['/lesson1']" 
         [disabled]="!checkCurrentLesson1" class="primair"> …
Run Code Online (Sandbox Code Playgroud)

properties button typescript angular

8
推荐指数
1
解决办法
7万
查看次数

标签 统计

angular ×1

button ×1

properties ×1

typescript ×1