为什么我的简易CRM Angular Web应用无法显示成功提示消息？

问题根因 #

你配置的@Component装饰器优先级错误：

• Angular组件中如果同时声明了template（内联模板）和外部模板文件，会优先使用内联模板内容，你当前app.component.ts里写了内联模板<h1>{{title}}</h1>，所以完全不会加载你写了提示逻辑的app.component.html文件，自然看不到成功提示框。

修复方法 #

修改app.component.ts里的@Component配置，将template属性替换为templateUrl指向外部html文件即可：

import { Component } from '@angular/core';

@Component({
   selector: 'app-root',
   // 把原来的template行替换成下面这行，指定加载外部html模板
   templateUrl: './app.component.html',
   styleUrls: ['./app.component.scss']
})
export class AppComponent {
       title = 'Simple_CRM_App';
       success_msg = true;
}

修改后重启服务，*ngIf绑定的提示块就会正常显示了。

内容的提问来源于stack exchange，提问作者Harsh Mendapara