Warning: Data binding failed. No object named '****' of type Fuse.Node found

Bug Reports
1

Hi,

Got a new “bug” with the 6078

This navigation building does not work

<App Theme="Basic">
<JavaScript>
var Observable = require("FuseJS/Observable");


var NavLink = Observable('PlacesChild');

module.exports = {
  NavLink : NavLink
}

</JavaScript>
    <DockPanel>

        <Panel Dock="Top" Height="30" Color="#000" />
        <Page ux:Class="MyPage" Background="#fff">
          <EnteringAnimation>
              <Move X="-1" RelativeTo="ParentSize" Duration="1"/>
          </EnteringAnimation>
          <ExitingAnimation>
              <Move X="1" RelativeTo="ParentSize" Duration="1"/>
          </ExitingAnimation>
        </Page>
        <Panel>
        <HierarchicalNavigation ux:Name="MainAppNav" Active="Places" />
        <MyPage Background="Red" Name="Places">
            <Button Height="50">
              <Clicked>
                <NavigateTo Target="{NavLink}"/>
              </Clicked>
            </Button>
        </MyPage>

        <MyPage Background="Blue" Name="PlacesChild" ux:AutoBind="false">
          <Button Height="50">
            <Clicked>
              <GoBack/>
            </Clicked>
          </Button>
        </MyPage>

        </Panel>
    </DockPanel>
</App>

It shows this when launched in preview

Warning: Data binding failed. No object named 'PlacesChild' of type Fuse.Node found

And the button does not work I tried with both Name=“PlacesChild” and ux:Name=“PlacesChild”.

Thanks.

2

Try:

var NavLink = Observable('Places');

function changePage() {
  NavLink.value = 'PlacesChild'
}

module.exports = { NavLink: NavLink, changePage: changePage }


<HierarchicalNavigation ux:Name="MainAppNav" Active="{NavLink}" />
<MyPage Background="Red" Name="Places">
  <Button Height="50">
    <Clicked>
      <Callback Handler="{changePage}" />
    </Clicked>
  </Button>
</MyPage>

However I’m still not sure why what you have does not work

3

Hi!

I’ve raised an internal issue for this. Thanks for reporting :slight_smile: !

4

I’ve looked into this issue some more, and that particular message is emitted because of the ux:AutoBind=“false”. Names are only available if the node they belong to are rooted (which they wont be with ux:AutoBind=“false”). You should consider changing your HierarchicalNavigation to a LinearNavigation or DirectNavigation.

I realise that the way HierarchicalNavigation works is fundamentally flawed in combination with data-binding. We are however in the process of improving the whole navigation API, so this won’t be the case forever :).