angular - 无法绑定到“ngIF”，因为它不是“ion-item”的已知属性

问题描述

我需要在我的 ionic4 项目的代码中使用 *ngIF，找到了一些答案，但没有一个有效，因为没有一个目标ionic 4是angular 7.

我试图导入该imports: [CommonModule]零件，但它根本不起作用。

这是我在.html文件中使用的代码：

<ion-app>
    <ion-split-pane>
        <ion-menu>
            <ion-header>
                <ion-toolbar color="medium">
                    <ion-title>Menu</ion-title>
                </ion-toolbar>
            </ion-header>
            <ion-content background="medium">
                <ion-list>
                    <ion-menu-toggle auto-hide="false">
                        <ion-item routerLink='/home'>
                            <ion-icon color="light" slot="start" name="home"></ion-icon>
                            <ion-label color="light">
                                Home
                            </ion-label>
                        </ion-item>
                        <ion-item routerLink='/list'>
                            <ion-icon color="light" slot="start" name="woman"></ion-icon>
                            <ion-label color="light">
                                Buy / Rent a Dress
                            </ion-label>
                        </ion-item>
                        <ion-item routerLink='/add-dress'>
                            <ion-icon color="light" slot="start" name="add"></ion-icon>
                            <ion-label color="light">
                                Add Dress for Sale/Rental
                            </ion-label>
                        </ion-item>
                        <ion-item routerLink='/create-account'>
                            <ion-icon color="light" slot="start" name="person-add"></ion-icon>
                            <ion-label color="light">
                                Register New Account
                            </ion-label>
                        </ion-item>
                        <ion-item routerLink='/login' *ngIF='authenticatedState()'>
                            <ion-icon color="light" slot="start" name="log-in"></ion-icon>
                            <ion-label color="light">
                                Login to your account
                            </ion-label>
                        </ion-item>
                    </ion-menu-toggle>
                </ion-list>
            </ion-content>
        </ion-menu>
        <ion-router-outlet main></ion-router-outlet>
    </ion-split-pane>
</ion-app>

我的.ts文件中有这段代码：

import {Component} from '@angular/core';
import { Storage } from '@ionic/storage';
import {Platform} from '@ionic/angular';
import {SplashScreen} from '@ionic-native/splash-screen/ngx';
import {StatusBar} from '@ionic-native/status-bar/ngx';
import { AuthServiceService } from './auth-service.service';

@Component({
    selector: 'app-root',
    templateUrl: 'app.component.html',
    styleUrls: ['main.scss'],
})
export class AppComponent {

    constructor(
        private platform: Platform,
        private splashScreen: SplashScreen,
        private statusBar: StatusBar,
        private storage: Storage,
        private authService: AuthServiceService,
    ) {
        this.initializeApp();
    }
    public appPages = [
        {
            title: 'Home',
            url: '/home',
            icon: 'home'
        },
        {
            title: 'Buy / Rent a Dress',
            url: '/list',
            icon: 'woman'
        },
        {
            title: 'Add Dress for Sale/Rental',
            url: '/add-dress',
            icon: 'add'
        },
        {
            title: 'Register New Account',
            url: '/create-account',
            icon: 'person-add'
        },
        {
            title: 'Login to your account',
            url: '/login',
            icon: 'log-in'
        },

    ];

    initializeApp() {
        this.platform.ready().then(() => {
            this.statusBar.styleDefault();
            this.splashScreen.hide();
        });
    }
    authenticatedState() {
        return this.authService.authenticated();
    }
}

如您所见， *ngIf 正在调用一个函数，该函数调用返回 a 的True服务False。

我得到的错误是：

Can't bind to 'ngIF' since it isn't a known property of 'ion-item'

标签： angulartypescriptionic-frameworkionic4

angular - 无法绑定到“ngIF”，因为它不是“ion-item”的已知属性

问题描述

解决方案

推荐阅读