角料不起作用的徽章

时间:2018-05-19 13:48:27

标签: angular angular-material

我将角度素材升级到6.0.2,我想使用fn init_a(a: Arc<A>) -> Arc<A> { // Raw IMMUTABLE pointer to the HashMap let ptr = &a.map as *const HashMap<_, _>; // Unsafely coerce it to MUTABLE let map: &mut HashMap<_, _> = unsafe { mem::transmute(ptr) }; let weak_a: Weak<A> = Arc::downgrade(&a); // Actual initialization here let vec = map.entry(0).or_insert(Vec::new()); let b1 = B { weak: weak_a.clone() }; let b2 = B { weak: weak_a.clone() }; vec.push(b1); vec.push(b2); a } 功能,但我的页面中没有显示。包配置看起来像:

badge

我写道:

{
    "name": "my.angular",
    "version": "0.0.0",
    "license": "MIT",
    "scripts": {
        "ng": "ng",
        "start": "ng serve",
        "build": "ng build --prod",
        "test": "ng test",
        "lint": "ng lint",
        "e2e": "ng e2e"
    },
    "private": true,
    "dependencies": {
        "@angular/animations": "^6.0.2",
        "@angular/cdk": "^6.0.2",
        "@angular/common": "^6.0.2",
        "@angular/compiler": "^6.0.2",
        "@angular/core": "^6.0.2",
        "@angular/flex-layout": "^5.0.0-beta.14",
        "@angular/forms": "^6.0.2",
        "@angular/http": "^6.0.2",
        "@angular/material": "^6.0.2",
        "@angular/platform-browser": "^6.0.2",
        "@angular/platform-browser-dynamic": "^6.0.2",
        "@angular/router": "^6.0.2",
        "core-js": "^2.4.1",
        "hammerjs": "^2.0.8",
        "ngx-cookie-service": "^1.0.10",
        "rxjs": "^6.1.0",
        "rxjs-compat": "^6.1.0",
        "zone.js": "^0.8.19"
    },
    "devDependencies": {
        "@angular-devkit/build-angular": "^0.6.3",
        "@angular/cli": "^6.0.2",
        "@angular/compiler-cli": "^6.0.2",
        "@angular/language-service": "^6.0.2",
        "@types/jasmine": "~2.8.3",
        "@types/jasminewd2": "~2.0.2",
        "@types/node": "~6.0.60",
        "codelyzer": "^4.0.1",
        "jasmine-core": "~2.8.0",
        "jasmine-spec-reporter": "~4.2.1",
        "karma": "~2.0.0",
        "karma-chrome-launcher": "~2.2.0",
        "karma-coverage-istanbul-reporter": "^1.2.1",
        "karma-jasmine": "~1.1.0",
        "karma-jasmine-html-reporter": "^0.2.2",
        "protractor": "~5.1.2",
        "ts-node": "~4.1.0",
        "tslint": "~5.9.1",
        "typescript": "^2.7.2"
    }
}

但徽章没有显示,只是简单的文字。

为什么?当然我导入了角度材质模块,我使用了<span matBadge="4" matBadgeOverlap="false">Text with a badge</span> 和角度材质的其他组件。

我创建了stackblitz

1 个答案:

答案 0 :(得分:11)

您需要导入MatBadgeModule才能使用它。

import {
  ...
  MatBadgeModule,
  ...
} from '@angular/material';

@NgModule({
  exports: [
    ...
    MatBadgeModule,
    ...
  ]
})
export class MaterialModule { }

此外,您需要在angular/material中导入styles.css的主题样式。

<强> styles.css的

@import '~@angular/material/prebuilt-themes/deeppurple-amber.css';

查看已修复的 demo