Knockout Typescript Passing object without wrapper

Question

I have a custom component that passes an object to the viewmodel of that component. Al this using typescript. The object arrives in the constructor but it is wrapped in an anonymous object by knockout.

Is there a way to prevent this and just get the strongly typed value object?

In the constructor I get this:

 Object { value: Order, $raw: Object }

I would like to have the value/Order immediately.

Here is my code:

index.html:

<div data-bind="foreach: Orders"/>
     <my-component params="value: $data"></my-component>
</div>

component.html:

 <span data-bind="text: Name"></span>

component.ts

ko.components.register('my-component', {
     viewModel: ComponentVm,
     template: component.html"
});

Component.ts:

class ComponentVm{
     public Name:string;

     constructor(order:Order){
          this.Name = order.Name; //Problem here because of anonymous object
     }
}

Order.ts:

Class Order {
      public Name:string = "Bob";
      constructor(){}
}

One solution would be:

 class ComponentVm{
     public Name:string;

     constructor(anonymousObject:any){
          let order = anonymousObject.value;
          this.Name = order.Name;
     }
}

But that is not really nice.

TSV · Accepted Answer · 2016-03-04 13:20:57Z

4

You can specify "params" object type in the "Component.ts":

class ComponentVm {
     public Name:string;

     constructor(params: { order: Order }){
          this.Name = params.order.Name;
     }
}

answered Mar 4, 2016 at 13:20

TSV

7,6681 gold badge33 silver badges39 bronze badges

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

Comments

Roy J · Accepted Answer · 2016-03-04 13:20:27Z

0

Pretty sure the short answer is "no". Components receive a params argument. But that doesn't mean you have to use an any type. Your params object should be well-defined.

params — an object that will be passed on to the component. Typically this is a key-value object containing multiple parameters, and is typically received by the component’s viewmodel constructor.

edited Mar 4, 2016 at 13:20

answered Mar 4, 2016 at 12:57

Roy J

44k10 gold badges84 silver badges106 bronze badges

2 Comments

Carbosound1 Over a year ago

Sorry i'm afraid i don't follow. How can i define the params object if i have no control over it? It supposed to be an Order (which is the definition of the params).

Roy J Over a year ago

No, it's an object that contains an Order.

Collectives™ on Stack Overflow

Knockout Typescript Passing object without wrapper

2 Answers 2

Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related