小编Par*_*shi的帖子

我正在构建一个有许多用户角色的应用程序.因此,当我登录时,我将用户角色返回到响应中并且必须相应地进行导航.我已经创建了一个服务url-redirect.service.ts,并且我已经创建了这样的函数.

redirect(user_role){ 

switch (user_role){
case 1: this.router.navigate[route1];
         break;
case 2: this.router.navigate[route2];
         break;

}

像那样.

但是在我将该事务委托给服务之后,事情就出现在login.component.ts中了.我有一些代码执行如下:

this.urlService.redirect(res.data[0].user_roles);

setCookies();

setLanguage();

and so on;

所以现在工作正常.但我只是觉得这样做是不对的,因为之后会有一些代码,并且路由会在这之间发生变化.我不确定有什么优点和缺点.有人可以告诉我,如果那是好的做法吗？

这是场景.我有一个UserConsoleModule和ShoppingCartModule.我有一个名为MyProfileComponent的组件.当你转到/ user-console时,你会看到MyProfileComponent,因此我把它放在UserConsoleModule的声明中.现在在/ shopping-cart/profile中,当用户退房时,我正在显示他的个人资料以确保每个信息都正常.所以我重用并将MyProfileComponent放在那里并在ShoppingCartModule中声明该组件.现在它说,组件是两个模块的一部分.我不知道为什么它有两个模块.他们是独立的.无论我重用哪些组件,我都声明在那个特定的模块中,我认为我很好,就像RC 5之前的声明一样.这个模块很好,但实际上却产生了很多混乱.

另一个问题是路线.我有一个AdminConsoleModule,我重用了UserConsoleModule和ShoppingCartModule.我做的是我在AdminConsoleModule的导入中导入了ShoppingCartModule.我/购物车重定向到/ shopping-cart/cart.因此,只要管理员控制台加载,它就会重定向到/ admin-console/cart.虽然它应该在路由器插座中加载UserResults.路由器很困惑.我在这里做错了吗？

作为解决方案的一部分,我制作了一个共享模块,它只包含购物车组件,其目的是在shopping-cart.module中导入shared-shopping-cart.module.ts和shopping-cart.routing.ts. ts,因此它仍然是分离的.但共享模块抛出一个错误,说路由器插座不称为我的shopping-cart.component.ts有路由器插座.

我的admin-console.routing.ts

const AdminConsoleRoutes: Routes = [
    {path: '',   component: AdminConsoleComponent,
        children: [
            {path: '',  component:UserResultsComponent},
            {path: 'search',  component:UserResultsComponent},
            {path: 'user-messages',  component: MyMessagesComponent},
            {path: 'user-profile',  component: MyProfileComponent },
            {path: 'user-progress',  component: MyProgressComponent},
            {path: 'user-receipts',  component: MyReceiptsComponent},
            {path: 'user-courses',   component: MyCoursesComponent},
            {path: 'group-membership',   component: GroupMembershipComponent},
        ]
    }
];

@NgModule({
    imports:[RouterModule.forChild(ManageUserRoutes)],
    exports:[RouterModule]
})

export class AdminConsoleRoutingModule{}

我的AdminConsoleModule:

@NgModule({
    imports:[CommonModule, FormsModule, ShoppingCartModule, UserConsoleModule,  AdminConsoleRoutingModule],
    declarations:[AdminConsoleComponent, UserSearchComponent, UserResultsComponent],
    exports:[]
})

export class AdminConsoleModule{}

我没有导入my-profile和一切,因为UserConsole有这些组件.

UserConsoleModule

@NgModule({ …

我正在制作一个社交媒体应用程序。我正在循环浏览所有评论并将其显示在用户界面上。当我单击编辑时，最后一条评论的文本总是显示在输入中。我尝试了很多不同的事情，改变了结构，使用bind来绑定上下文，但没有任何帮助。

我正在使用 React Material UI。

这是代码：

render() {

    const { anchorEl } = this.state;
    const open = Boolean(anchorEl);

    return(
        <Panel>
            <form noValidate autoComplete="off" onSubmit={this.onSubmit}>
                <TextField
                    id={`comment${this.state.post_id}`}
                    name="comment"
                    fullWidth
                    placeholder="Comment here"
                    margin="normal"
                    value={this.state.comment}
                    onChange={this.handleChange}
                    InputProps={{
                        endAdornment : <InputAdornment position="end">
                            <IconButton onClick={this.resetTextField}>
                                <CloseIcon/>
                            </IconButton>
                        </InputAdornment>
                    }}
                />
            </form>

            {this.props.comments && this.props.comments.length > 0 &&
            <RenderComments
                comments={this.state.comments}
                open={open}
                anchorEl={this.state.anchorEl}
                handleClick={this.handleClick}
                handleClose={this.handleClose}
                handleDelete={this.handleDelete}
                handleEdit={this.handleEdit}
            />
            }
        </Panel>
    )
}

const RenderComments = (props) => {
    return props.comments.map(comment =>
        <CommentBase
            key={comment.id}
            comment={comment}
            open={props.open}
            anchorEl={props.anchorEl}
            handleClick={props.handleClick} …