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. 《c程序设计语言》-2.9

    #include <stdio.h> /*int bitcount(unsigned x) { int b; for(b = 0;x != 0;x >>= 1) { if(x ...

  2. Codeforces 934.D A Determined Cleanup

    D. A Determined Cleanup time limit per test 1 second memory limit per test 256 megabytes input stand ...

  3. 7月12号day4总结

    今天学习过程和总结 封装JDBC在src/main/java下com.neuedu下utils建立JDBCUilt.java 进行封装,基于框架的开发要么继承父类要么实现接口 一个方法里只能有一个动态 ...

  4. 洛谷P3144 [USACO16OPEN]关闭农场Closing the Farm

    农夫约翰和他的奶牛准备去旅行,所以约翰想要把他的农场临时关闭. 农场有N个牛棚(牛棚从1到N编号),有M条路连接这些牛棚(1≤N,M≤3000). 约翰打算挨个关闭牛棚,在关牛棚的时候, 他突然想起一 ...

  5. NuGet Package Manager 实用命令

    Creating Help Pages for ASP.NET Web API Install-Package Microsoft.AspNet.WebApi.HelpPage Install-Pac ...

  6. 除了IE浏览器，其他浏览器都联不上网怎么办~转载百度经验

    百度师傅最快的到家服务,最优质的电脑清灰 百度经验:jingyan.baidu.com 有个网友遇到一个非常奇怪的上网问题,刚才始,发现QQ不能登录,后来接着发现火狐浏览器也打不开网页,刚开始,以为只 ...

  7. VLC for iOS 2.3.0

    http://www.cocoachina.com/bbs/read.php?tid=231898 VLC for iOS 2.3.0       本帖属于CocoaChina会员发表,转帖请写明来源 ...

  8. Flask学习总结笔记推荐

    https://blog.csdn.net/kikaylee/article/category/6551426

  9. 2017网易---Fibonacci数列

    题目描述 Fibonacci数列是这样定义的:F[0] = 0F[1] = 1for each i ≥ 2: F[i] = F[i-1] + F[i-2]因此,Fibonacci数列就形如:0, 1, ...

  10. WCF使用小例子

    using System.Runtime.Serialization; using System.ServiceModel; using MySpace; using System.ServiceMo ...