在组件初始化中，我正在从服务器获取数据
import {Rules} from "../../interfaces/interfaces";
rules: Rules
ngOnInit() {
this.tt = this.rulesService.getUserClientRules().subscribe(
t => {
console.log(t)
console.log(t.clientRules.canAll)
this.rules = t.clientRules
},
error => {
console.log(error.error.message)
}
)
}
我的服务代码是
getUserClientRules(): Observable<Rules> {
return this.http.get<Rules>('/api/rules/getClientUserRules/')}
and I have interface like:
export interface Rules {
clientRules: any
}
我得到这样的回应：
**{clientRules: {canAll: true, canSee: false}}**
如何将这个对象放入规则对象？我想像rules.canAll或rules.canSeeAll那样使用它...
当我尝试console.log（this.rules）时，我变得不确定
我需要这种结构规则{canAll：true，canSee：true}我需要将其用于* ngIf =“ rules.canSee”
谢谢您的反馈！！！
根据您的要求，界面实际上应该像
export interface Rules {
canAll: boolean;
canSee: boolean;
}
然后，您可以让RxJSmap运算符clientRules从HTTP调用返回属性
服务
getUserClientRules(): Observable<Rules> {
return this.http.get<Rules>('/api/rules/getClientUserRules/').pipe(
map(response => response['clientRules'])
);
}
然后，您可以将响应直接分配给rules组件中的变量
零件
rules: Rules
ngOnInit() {
this.tt = this.rulesService.getUserClientRules().subscribe(
t => {
console.log(t);
console.log(t.canAll);
this.rules = t; // <-- the response is already the `clientRules` property
},
error => {
console.log(error.error.message)
}
);
}
然后，您可以使用安全导航操作符在模板中使用它，?.以避免不必要的undefined错误。
模板
<div *ngIf="rules?.canSee">
User can see...
</div>
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句