How to pass an object in typescript to HTML string without angular $compile

Question

This is an angular program, but a package we wrote is in typescript. Basically what I am trying to solve is how do I make 'this' go into the HTML string as a real angular bound object. I can't use $compile because this is a typescript file. Any help is appreciated. Currently I can only pass pieces of the object as strings, like this.name.

    export class GroupView extends ObjView {
        name: string = "GroupView";

        constructor(parentView: GroupView, protected group: Group) {
            super(parentView, group)
            if(group){
                this.name = group.name
                this.structureItem = '<custom-directive this-model="' + this + '" name="' + this.name + '"></custom-directive>';
            }
        }
   }

Once the this.structureItem is added to the page, I need to be able to access this-model by reference... the actual object not a copy of it.

You might be able to use GroupView there instead of this, but I suspect that it will not work the way you are wanting. — Chris Barr
– Chris Barr, Commented Jan 30, 2019 at 14:19

user6749601 · Accepted Answer · 2019-01-30 17:13:25Z

1

I'd suggest another approach. Use the ng-if-directive in the HTML-template. For example:

TS

constructor(parentView: GroupView, protected group: Group) {
    super(parentView, group)
        if(group){
            this.name = group.name;
    }
}

HTML

<custom-directive ng-if="group" name="name"></custom-directive>

This way the element will only be visible when group is valid.

answered Jan 30, 2019 at 17:13

user6749601

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to pass an object in typescript to HTML string without angular $compile

1 Answer 1

Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Related