3

This is a sample of my three columns. I want to customize the width sizes.

resetPassword: {
    title: this.gridTittle["ResetPassword"],
    type: 'custom',
    renderComponent: UserPasswordResetComponent,
    filter: false
},
userName: {
    title: this.gridTittle["UserName"],
},
roleTypeDescription: {
    title: this.gridTittle["UserType"],
    type: 'text',
    filter: false
},
2

3 Answers 3

7

You can use the width property. As the documentation, "column width example: '20px', '20%'". In your code:

resetPassword: {
    title: this.gridTittle["ResetPassword"],
    type: 'custom',
    renderComponent: UserPasswordResetComponent,
    filter: false,
    width: 25%
},
userName: {
    title: this.gridTittle["UserName"],
    width: 25%
},
roleTypeDescription: {
    title: this.gridTittle["UserType"],
    type: 'text',
    filter: false,
    width: 50%
},
1
  • 1
    should have single qoute in your width percent Aug 15, 2019 at 1:44
0

Important >> this value of widht between quotation marks

columns: {
      id: {
        title: '#',
        type: 'string',
        sortDirection: 'desc',
        width: '30px'
      },
      name: {
        title: 'Nome',
        type: 'string',
      },
      lastName: {
        title: 'Sobrenome',
        type: 'string',
      },
      username: {
        title: 'Usuário',
        type: 'string',
      }
}
0

I was not able to make it work with the column attribute.
My solution is:

:host {
  ::ng-deep .yourColumnName .ng2-smart-title {
    width: 100px;
  }
}

or

:host {
  ::ng-deep .ng2-smart-title {
    min-width: 150px;
  }
}

You have a thread here with it

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.