When want to display different component based on some conditions:

<div class='course-category' [ngSwitch]="course.category">

    <div class="category" *ngSwitchCase="'BEGINNER'">Beginner</div>

    <div class="category" *ngSwitchCase="'INTERMEDIATE'">Intermediate</div>

    <div class="category" *ngSwitchCase="'ADVANCE'">Advance</div>

    <div class="category" *ngSwitchDefault="'BEGINNER'">All levels</div>

</div>

　　

[Angular] Angular ngSwitch Core Directive In Detail的更多相关文章

  1. Angular自定义指令（directive）

    angular自定义指令,意我们可以通过angula自己定义指令,来实现我们的特殊要求,为所欲为,一支穿云箭,千军万马来相见 多少年的老规矩了,先看代码: <!DOCTYPE html> ...

  2. angular的GitHub Repository Directive Example学习

    angular的GitHub Repository Directive Example学习 <!DOCTYPE html> <html ng-app="myApp" ...

  3. angular自定义指令－directive

    Directive究竟是个怎么样的一个东西呢?我个人的理解是这样的:将一段html.js封装在一起,形成一个可复用的独立个体,具体特定的功能.下面我们来详细解读一下Directive的一般性用法. v ...

  4. -_-#【Angular】自定义指令directive

    AngularJS学习笔记 <!DOCTYPE html> <html ng-app="Demo"> <head> <meta chars ...

  5. Angular之 Scope和 Directive

    ---------------------------Scope-------------------------------- https://docs.angularjs.org/guide/sc ...

  6. Angular + asp.net core 入门

    一.简介 通俗的理解,Angular 只是一个前端框架,它只负责前端的事,但一个完整的项目还应该有后端,这其中之一可选的技术就是 asp.net core .这里简单学习一下两个框架之间的协同开发. ...

  7. [Angular] @ViewChild read custom directive and exportAs

    For example we have a component: <Card ></Card> And a driective: <Card highlighted> ...

  8. Angular - - angular.Module

    angular.Module Angular模块配置接口. 方法: provider(name,providerType); name:服务名称. providerType:创建一个服务的实例的构造函 ...

  9. Angular - - Angular数据类型判断

    angular.isArray 判断括号内的值是否为数组. 格式:angular.isArray(value); value: 被判断是否为数组的值. ------------------------ ...

随机推荐

  1. P2659 美丽的序列 (单调栈)

    题目链接 Solution 直接考虑单调栈处理出每一个点作为最小值的区间长度. 然后 \(O(n)\) 找一遍最大值即可. 记得开 long long,以及要注意 \(0\) 的问题. Code #i ...

  2. UIImage 获取url图片资源

    //UIImage 获取url图片资源 -(UIImage *) getImageFromURL:(NSString *)fileURL { UIImage * result; NSData * da ...

  3. EOJ-大学生程序设计邀请赛（华东师范大学）-E-黑心啤酒厂

    E. 黑心啤酒厂 Time limit per test: 1.0 seconds Time limit all tests: 1.0 seconds Memory limit: 256 megaby ...

  4. bananahill(NOIP模拟赛Round 8)

    题目描述 香蕉川由座香蕉山组成,第i座山有它的高度.小Z准备从左到右爬这里的恰好座香蕉山,但他不希望山的高度起伏太大,太过颠簸,会让本就体育不好的他过于劳累.所以他定义了爬山的劳累度是所有爬的相邻的两 ...

  5. FreeRTOS系列第2篇---FreeRTOS入门指南【转】

    转自:http://blog.csdn.net/zhzht19861011/article/details/49819309 版权声明:本文为博主原创文章,未经博主允许不得转载.联系邮箱:zhzhch ...

  6. Linux虚拟地址空间布局以及进程栈和线程栈总结

    原文链接:http://blog.csdn.net/freeelinux/article/details/53782986[侵删] 本文转自多个博客,以及最后有我的总结.我没有单独从头到尾写一个总结的 ...

  7. OutputDebugString方便格式化WIN32封装

    void TRACE(LPCTSTR lpszFmt, ...) { va_list args; va_start(args, lpszFmt); ; TCHAR *lpszBuf = (TCHAR* ...

  8. win2008通过计划任务定时执行bat文件

    前段时间在Windows Server 2008安装了一套基于MySQL数据库的软件,处于数据安全的考虑,希望每天能够自动进行数据库备份.我在别人脚本的基础上自己写了一个数据库备份的bat脚本,双击该 ...

  9. log4j - 1

    具体内容: 1.       如何在项目中配置log4j使得该系统可以输出web test的日志文件(自定义格式)到工程dist目录下的junitLog/WebTestLog.log目录下,输出508 ...

  10. Unique Word Abbreviation -- LeetCode

    An abbreviation of a word follows the form <first letter><number><last letter>. Be ...