Possibility to select one node from the id.

[circlongroup]

Possibility to select one node from the id.

I intend to solve this by adding locators on the tree according to id /
path.
Also, need an "ensureVisible" method that expands and scrolls to it.

So will be able to do:
node = tree.findNodeById(id)
or
node = tree.findNodeByPath(['parent', 'child', 'leaf'])

and then:
node.toggleActivated();
node.ensureVisible();

What do you think?

On Tue, Aug 2, 2016 at 12:18 PM, Gillardo [email protected] wrote:

I am also looking for this functionality, this would be a great addition
to have.

I have a list of folders that are being displayed in the treeview, i would
like to select the folder by id, and the treeview should automatically be
expanded to that node, with that node selected.

—
You are receiving this because you are subscribed to this thread.
Reply to this email directly, view it on GitHub
#22 (comment),
or mute the thread
https://github.com/notifications/unsubscribe-auth/ACUsQzcOdK5yWxoCSJkKq4VLUs9LVf3Kks5qbwtlgaJpZM4JYtrH
.

Adam Klein
CTO & Co-Founder
Tel. [phone]
blog.500tech.com http://blog.500tech.com
meetup.com/angularjs-il

[Gillardo]

I am also looking for this functionality, this would be a great addition to have.

I have a list of folders that are being displayed in the treeview, i would like to select the folder by id, and the treeview should automatically be expanded to that node, with that node selected.

[Gillardo]

Yeah that should work fine. I aint to bothered about the findNodeByPath method, but i think the findByNode method is great. and then the ensureVisible and toggleActiviated are perfect to.

[Gillardo]

Can i be cheeky and ask....timescale?

I hope to work on it over the weekend.
There's quite a backlog of requests, so not entirely sure I'll make it.

P.S. This is an open source project, so feel free to implement it yourself
and do a Pull Request. Just let me know you're working on it.

On Tue, Aug 2, 2016 at 3:37 PM, Gillardo [email protected] wrote:

Can i be cheeky and ask....timescale?

—
You are receiving this because you commented.
Reply to this email directly, view it on GitHub
#22 (comment),
or mute the thread
https://github.com/notifications/unsubscribe-auth/ACUsQ4d4QCNVatdXgNKAXj4_dQlqzqy0ks5qbzn-gaJpZM4JYtrH
.

Adam Klein
CTO & Co-Founder
Tel. [phone]
blog.500tech.com http://blog.500tech.com
meetup.com/angularjs-il

[Gillardo]

I also think, that a method to remove a node by id, or by object should also be included with this. In our system, we have a list of pages, and if a page is removed, i would like to easily remove it from the treeview.

Noted.
I'm doing a refactor do make the tree binded directly to the nodes
structure.
So basically you could just remove the node from your data structure.
But I guess a utility function to remove a node will be nice.

On Wed, Aug 3, 2016 at 11:55 AM, Gillardo [email protected] wrote:

I also think, that a method to remove a node by id, or by object should
also be included with this. In our system, we have a list of pages, and if
a page is removed, i would like to easily remove it from the treeview.

—
You are receiving this because you commented.
Reply to this email directly, view it on GitHub
#22 (comment),
or mute the thread
https://github.com/notifications/unsubscribe-auth/ACUsQytQEVU_ogS7nZMMklvz-J4-DWkoks5qcFebgaJpZM4JYtrH
.

Adam Klein
CTO & Co-Founder
Tel. [phone]
blog.500tech.com http://blog.500tech.com
meetup.com/angularjs-il

[adamkleingit]

I added a getNodeById method to the treeModel (still undocumented).
Still haven't gotten to ensureVisible method, but you can work that one by yourself in the meantime (just traverse up using parent, and call toggleExpanded).

[Gillardo]

Is this available on npm yet?

Yes, version 1.1.12

On Mon, Aug 8, 2016 at 11:19 AM, Gillardo [email protected] wrote:

Is this available on npm yet?

—
You are receiving this because you commented.
Reply to this email directly, view it on GitHub
#22 (comment),
or mute the thread
https://github.com/notifications/unsubscribe-auth/ACUsQxMBjPzPXvE4Qmb4OSGwyw4aLGaEks5qduargaJpZM4JYtrH
.

Adam Klein
CTO & Co-Founder
Tel. [phone]
blog.500tech.com http://blog.500tech.com
meetup.com/angularjs-il

[adamkleingit]

Have you tried it? Did it work?

[Gillardo]

Not tried this yet, as everytime i do npm install --save i do not get 1.1.12, but 1.1.10

[adamkleingit]

Maybe u have the version fixed in package.json?

On Aug 9, 2016 17:52, "Gillardo" [email protected] wrote:

Not tried this yet, as everytime i do npm install --save i do not get
1.1.12, but 1.1.10

—
You are receiving this because you commented.
Reply to this email directly, view it on GitHub
#22 (comment),
or mute the thread
https://github.com/notifications/unsubscribe-auth/AA2SSgCtbzDUsaIPDSePpFb2drr632Jmks5qeJQRgaJpZM4JYtrH
.

Change to 1.1.12 and run npm update angular2-tree-component

On Tue, Aug 9, 2016 at 9:07 PM, adam klein [email protected] wrote:

Maybe u have the version fixed in package.json?

On Aug 9, 2016 17:52, "Gillardo" [email protected] wrote:

Not tried this yet, as everytime i do npm install --save i do not get
1.1.12, but 1.1.10

—
You are receiving this because you commented.
Reply to this email directly, view it on GitHub
<https://github.com/500tech/angular2-tree-component/
issues/22#issuecomment-238578470>,
or mute the thread
<https://github.com/notifications/unsubscribe-auth/
AA2SSgCtbzDUsaIPDSePpFb2drr632Jmks5qeJQRgaJpZM4JYtrH>
.

—
You are receiving this because you commented.
Reply to this email directly, view it on GitHub
#22 (comment),
or mute the thread
https://github.com/notifications/unsubscribe-auth/ACUsQzYxGWdh7RJbYBPXEbQiVx1FxDMvks5qeMHugaJpZM4JYtrH
.

Adam Klein
CTO & Co-Founder
Tel. [phone]
blog.500tech.com http://blog.500tech.com
meetup.com/angularjs-il

[Gillardo]

Cant get this to work...Think i need help. I have managed to get 1.1.13. My code is loading my folder using the ngOnInit method, and my folderId is being passed as an Input() to this component.

How can i set the node?

I have tried this, but findById always returns null

export class SaveComponent implements OnInit {
    @ViewChild('tree')
    tree: TreeComponent;

    @Input()
    report: IReport;

    nodes: Folder[];

    constructor(
        private folderService: FolderService)
    { }

    ngOnInit() {
        this.folderService.getAll(null, '', true)
            .then(result => this.nodes = result);
    }

    onInitialized($event) {
        let node = this.tree.treeModel.getNodeById(this.report.folderId);

        if (node)
            node.toggleExpanded();

        console.log(JSON.stringify(node));
    }

    // when page node is selected
    onActivate(event) {
        this.report.folderId = event.node.id;
    }
}

My html to this component, is like so

<div class="col-md-3 m-b-1">
    <a class="btn btn-outline-secondary m-b-1" (click)="alert('add folder coming soon')">Add New</a>
    <Tree #tree [nodes]="nodes" (onActivate)="onActivate($event)" (onInitialized)="onInitialized($event)"></Tree>
</div>

What am i doing wrong?

[Gillardo]

Right got this to work, by changing some of my code, but it seems hacky.

First, i had to add *ngIf to my html, so it now looks like this

<div class="col-md-3 m-b-1" *ngIf="nodes">
    <a class="btn btn-outline-secondary m-b-1" (click)="alert('add folder coming soon')">Add New</a>
    <Tree #tree [nodes]="nodes" (onActivate)="onActivate($event)" (onInitialized)="onInitialized($event)"></Tree>
</div>

Then i changed the OnInitialized function to this

    onInitialized($event) {
        setTimeout(() => {
            let node = this.tree.treeModel.getNodeById(this.report.folderId);

            if (node)
                node.toggleActivated();
        }, 0);
    }

I personally think that the treeView needs some sort of onModelChanged event. So that you dont need to put a *ngIf around it, which means that you dont need the setTimeout in the onIntitialized method either. So code would look like this

<div class="col-md-3 m-b-1">
    <a class="btn btn-outline-secondary m-b-1" (click)="alert('add folder coming soon')">Add New</a>
    <Tree #tree [nodes]="nodes" (onActivate)="onActivate($event)" (onModelChanged)="onModelChanged($event)"></Tree>
</div>

    onModelChanged($event) {
        let node = this.tree.treeModel.getNodeById(this.report.folderId);

        if (node)
            node.toggleExpanded();
    }

What do you think?

[Gillardo]

Looking at your code, am i right in thinking you already have such an event called onUpdateData but this is out available as an @Output.

Any chance we could make this available as an output?

Yes I'll add.
That's a good point, I'll add *ngIf on nodes

On Wed, Aug 10, 2016 at 2:29 PM, Gillardo [email protected] wrote:

Looking at your code, am i right in thinking you already have such an
event called onUpdateData but this is out available as an @output.

Any chance we could make this available as an output?

—
You are receiving this because you commented.
Reply to this email directly, view it on GitHub
#22 (comment),
or mute the thread
https://github.com/notifications/unsubscribe-auth/ACUsQ0J-UtADp3PUgPeMdFO_v9grmTO-ks5qebYCgaJpZM4JYtrH
.

Adam Klein
CTO & Co-Founder
Tel. [phone]
blog.500tech.com http://blog.500tech.com
meetup.com/angularjs-il

[adamkleingit]

I'm closing this issue though