Новые подписки всегда возвращают интенсивное значение вместо текущего значенияHtml

Программисты Html
Ответить
Anonymous
 Новые подписки всегда возвращают интенсивное значение вместо текущего значения

Сообщение Anonymous »

У меня есть относительно простое угловое приложение, использующее службы для передачи значений между моими компонентами. Проблема, с которой я сталкиваюсь, заключается в том, что когда я перехожу к новому маршруту и ​​загружаю компонент, подписываюсь на службу, она всегда возвращает интенсивное значение вместо текущего значения. < /P>
Main App.component имеет компонент для меню, а затем маршрутизатор для загрузки компонентов на основе маршрута, когда пользователь нажимает на элемент меню. У меня есть сервис, который подписан и обновляет текущий выбранный элемент меню в компоненте меню. Другие компоненты подписываются на одну и ту же услугу, чтобы получить текущий пункт меню, но они всегда просто получают начальное значение, а не текущее значение при подписке на Сервис. Подписка в компоненте меню всегда обновлена ​​и получает правильные значения. < /P>
Компонент меню: < /p>
br />
@Component({
selector: 'app-menu',
templateUrl: './menu.component.html',
styleUrls: ['./menu.component.scss'],
providers: [MenuDatabase, NavigationService],
standalone: false
})
export class MenuComponent implements OnInit {

@Input() treeControl = new NestedTreeControl(node => {
return (node.models) ? node.models : node.actions;
});

public activeItem: MenuItem | undefined;
public versionList: Version[] = [];
public menuItemList: MenuItem[] = [];
public currentVersion: string = '';
public isSearching: boolean = false;
public searchForm = new UntypedFormGroup({ search: new UntypedFormControl('') });

hasChild = (_: number, node: MenuItem) =>
(!!node.models && node.models.length > 0) ||
(!!node.actions && node.actions.length > 0);

dataSource = new MatTreeNestedDataSource();

constructor(
public router: Router,
public menuService: MenuService,
private navigationService: NavigationService,
private database: MenuDatabase,
){
navigationService.activeMenuItem$.subscribe(
item => {
this.activeItem = item;
}
)
}

ngOnInit(): void {

}

navigate(menuItem: MenuItem) {
if(menuItem.models)
this.router.navigate([`${this.currentVersion}/module/${menuItem.code}`], { state: { ep: menuItem } });
if(menuItem.actions)
this.router.navigate([`${this.currentVersion}/model/${menuItem.code}`], { state: { ep: menuItem } });
if(!menuItem.actions && !menuItem.models)
this.router.navigate([`${this.currentVersion}/action/${menuItem.code}`], { state: { ep: menuItem } });
this.navigationService.setActiveMenuItem(menuItem)
}< /code>
< /div>
< /div>
< /p>
navigationservice: < /p>


@Injectable({
providedIn: 'root'
})
export class NavigationService {

private defaultItem = {
title: "Home",
code: "home"
}
// Observable string sources
private activeMenuItemSource = new BehaviorSubject(this.defaultItem);

// Observable string streams
activeMenuItem$ = this.activeMenuItemSource.asObservable();

constructor(){
}

// Service message commands
setActiveMenuItem(activeItem: MenuItem) {
console.log("from: " + this.activeMenuItemSource.getValue().title + " | to: " + activeItem.title)
this.activeMenuItemSource.next(activeItem);
}< /code>
< /div>
< /div>
< /p>
console.log в службе Метод setActiveMenuitem () вызывается из компонента меню. < /p>
Компонент, загруженный при навигации ().

@Component({
selector: 'app-action-page',
templateUrl: './action-page.component.html',
styleUrls: ['./action-page.component.scss'],
standalone: false
})
export class ActionPageComponent implements OnInit {

@Input() treeControl = new NestedTreeControl(node => {
return (node.models) ? node.models : node.actions;
});

@Input() menuItem: MenuItem;

constructor(
private activatedRoute: ActivatedRoute,
private actionService: ActionService,
private navigationService: NavigationService
) {
};

ngOnInit(): void {
this.activatedRoute.url.subscribe(seg => {
this.version = seg[0].path || '';
this.level = seg[1].path || '';
this.itemCode = seg[2].path || '';

this.actionService.getAction(this.itemCode)
.subscribe(data => {
this.item = data
})

});

this.navigationService.activeMenuItem$.subscribe(
item => {
console.log(item)
}
)
}< /code>
< /div>
< /div>
< /p>
Журнал консоли в Actionpageponent всегда показывает «дом» (inital value Для наблюдаемого поведения)>

Подробнее здесь: https://stackoverflow.com/questions/793 ... rent-value
Ответить

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

Вернуться в «Html»